一种3d可视化地图生成方法技术

技术编号:35691336 阅读:14 留言:0更新日期:2022-11-23 14:39
本发明专利技术涉及地图生成技术领域,提供一种3d可视化地图生成方法,本发明专利技术的方法,包括:解析标准地图数据,生成平面区域轮廓坐标;根据生成的平面区域轮廓坐标生成平面轮廓;将平面轮廓拉伸为区块三维实体;创建地图标注实体;将地图标注实体关联绑定到区块三维实体,生成地图标注三维图表;为地图标注三维图表添加动画效果,生成3d可视化地图。根据本发明专利技术示例性实施例的3d可视化地图生成方法,可以实现3d可视化区域地图标注和动画配置,丰富web端三维图表的内容;同时降低3d数据可视化使用门槛,配置丰富,简单易懂,提升三维图表开发速度。提升三维图表开发速度。提升三维图表开发速度。

【技术实现步骤摘要】
一种3d可视化地图生成方法


[0001]本专利技术涉及地图生成
,尤其涉及一种3d可视化地图生成方法。

技术介绍

[0002]Vue

map

3d可视化地图插件是基于three.js且运用WebGL技术,在web端将需要展示的可视化数据渲染展示成3d地图图表的技术。目前,web端地图可视化图表实现主要分为svg图表和canvas图表两种,前者是2d矢量图表,后者又可以分普通2d图表和基于WebGL实现的3d图表。在实际应用中,如何渲染出3d的地图和标注可视化的数据并添加动画到地图上包括三个核心技术:1.解析标准地图数据,渲染拉伸出地图实体;2.提取地图实体对象片区和坐标,将可视化数据转化成标注对象实体并绑定插入到片区或坐标;3.提取地图实体或标注实体,添加动画执行的算法和方法到各实体。但是目前web端还没有一款能够快速配置使用的三维数据可视化地图库,现有技术中已有的大多是普通柱状图、饼状图三维库,地理相关三维库大多是地球动画特效等,无法绘制三维地理轮廓和地理标注,动画效果不好,配置相对复杂局限。
[0003]因此,如何提供一种3d可视化地图生成方法,丰富3d可视化区域地图标注和动画实现的内容,降低3d数据可视化使用门槛,成为亟待解决的技术问题。

技术实现思路

[0004]有鉴于此,本专利技术提供一种3d可视化地图生成方法,用于实现3d可视化区域地图标注和动画配置,降低3d数据可视化使用门槛。
[0005]本专利技术提供一种3d可视化地图生成方法,包括:
[0006]步骤S1:解析标准地图数据,生成平面区域轮廓坐标;
[0007]步骤S2:根据生成的平面区域轮廓坐标生成平面轮廓;
[0008]步骤S3:将平面轮廓拉伸为区块三维实体;
[0009]步骤S4:创建地图标注实体;
[0010]步骤S5:将地图标注实体关联绑定到区块三维实体,生成地图标注三维图表;
[0011]步骤S6:为地图标注三维图表添加动画效果,生成3d可视化地图。
[0012]进一步地,本专利技术3d可视化地图生成方法的步骤S1,包括:
[0013]步骤S11:将标准地图的经纬度坐标转换为墨卡托坐标;
[0014]步骤S12:从墨卡托坐标中获取具有center属性的区域基准中心的墨卡托坐标,对所有墨卡托坐标进行偏移,得到平面区域轮廓坐标。
[0015]进一步地,本专利技术3d可视化地图生成方法的步骤S12中,对所有墨卡托坐标进行偏移,包括:用墨卡托坐标的横坐标和纵坐标分别减去基准中心的墨卡托坐标的横坐标和纵坐标。
[0016]进一步地,本专利技术3d可视化地图生成方法的步骤S2,包括:
[0017]步骤S21:对three.js提供的shape类进行实例化处理,得到实例化后的shape基础
对象;
[0018]步骤S22:通过shape基础对象提供的串联方法串联平面区域轮廓坐标,生成封闭可拉伸的shape对象,获得封闭区域平面轮廓。
[0019]进一步地,本专利技术3d可视化地图生成方法的步骤S3,包括:
[0020]步骤S31:配置区块三维实体所需的配置参数;
[0021]步骤S32:通过three.js的ExtrudeGeometry类将配置参数和shape对象拉伸生成区块三维实体对象,并暴露区块三维实体对象各子区域实体的中心坐标属性。
[0022]进一步地,本专利技术3d可视化地图生成方法的步骤S4,包括:
[0023]步骤S41:创建厚度为零的三维实体标注框;
[0024]步骤S42:在三维实体标注框中填充可配置编辑的标注内容:
[0025]步骤S43:在填充后的三维实体标注框外层套设一层透明点实体,将透明点实体将进行暴露。
[0026]进一步地,本专利技术3d可视化地图生成方法的步骤S5,包括:
[0027]步骤S51:自定义三维坐标和三维旋转角度的绑定配置;
[0028]步骤S52:根据绑定配置将地图标注实体添加到区块三维实体对象各子区域实体的中心点位置,生成地图标注三维图表。
[0029]进一步地,本专利技术3d可视化地图生成方法的步骤S6,包括:
[0030]步骤S61:通过调取javascript系统函数中的requestAnimationFrame函数,获得轮询回调函数;
[0031]步骤S62:将所有可配置动效的实体实例绑定到轮询回调函数的参数属性;
[0032]步骤S63:执行轮询回调函数,通过轮询回调函数对所有实体实例进行动画状态帧的批量配置。
[0033]进一步地,本专利技术3d可视化地图生成方法步骤S6中的实体实例,包括地图标注实体实例对象以及区块三维实体中的各子区域实体实例对象。
[0034]本专利技术的3d可视化地图生成方法,可以实现3d可视化区域地图标注和动画配置,丰富web端三维图表的内容;同时降低3d数据可视化使用门槛,配置丰富,简单易懂,提升三维图表开发速度。
附图说明
[0035]为了更清楚地说明本专利技术实施例的技术方案,下面将对实施例中所需要使用的附图作简单地介绍,显而易见地,下面描述中的附图仅仅是本专利技术的一些实施例,对于本领域普通技术人员来讲,在不付出创造性劳动的前提下,还可以根据这些附图获得其它的附图。
[0036]图1为本专利技术示例性第一实施例一种3d可视化地图生成方法的流程图。
[0037]图2为本专利技术示例性第二实施例一种3d可视化地图生成方法的流程图。
[0038]图3为本专利技术示例性第三实施例一种3d可视化地图生成方法的流程图。
具体实施方式
[0039]下面结合附图对本专利技术实施例进行详细描述。
[0040]需说明的是,在不冲突的情况下,以下实施例及实施例中的特征可以相互组合;并
且,基于本公开中的实施例,本领域普通技术人员在没有作出创造性劳动前提下所获得的所有其他实施例,都属于本公开保护的范围。
[0041]需要说明的是,下文描述在所附权利要求书的范围内的实施例的各种方面。应显而易见,本文中所描述的方面可体现于广泛多种形式中,且本文中所描述的任何特定结构及/或功能仅为说明性的。基于本公开,所属领域的技术人员应了解,本文中所描述的一个方面可与任何其它方面独立地实施,且可以各种方式组合这些方面中的两者或两者以上。举例来说,可使用本文中所阐述的任何数目个方面来实施设备及/或实践方法。另外,可使用除了本文中所阐述的方面中的一或多者之外的其它结构及/或功能性实施此设备及/或实践此方法。
[0042]本专利技术的技术原理如下:
[0043]通过现有的二维可视化地图库,了解用户地图标注常用功能需求,将地图和标注部分做成三维并加以炫酷特效动画。具体的,为了绘制全国各个省市区县的地图,封装标准地图数据解析方法,通过WebGL能力拉伸出地图轮廓三维实体,整个过程需要收集各个子区域实体对象,便于后本文档来自技高网
...

【技术保护点】

【技术特征摘要】
1.一种3d可视化地图生成方法,其特征在于,所述方法,包括:步骤S1:解析标准地图数据,生成平面区域轮廓坐标;步骤S2:根据生成的平面区域轮廓坐标生成平面轮廓;步骤S3:将平面轮廓拉伸为区块三维实体;步骤S4:创建地图标注实体;步骤S5:将地图标注实体关联绑定到区块三维实体,生成地图标注三维图表;步骤S6:为地图标注三维图表添加动画效果,生成3d可视化地图。2.根据权利要求1所述的3d可视化地图生成方法,其特征在于,步骤S1,包括:步骤S11:将标准地图的经纬度坐标转换为墨卡托坐标;步骤S12:从墨卡托坐标中获取具有center属性的区域基准中心的墨卡托坐标,对所有墨卡托坐标进行偏移,得到平面区域轮廓坐标。3.根据权利要求2所述的3d可视化地图生成方法,其特征在于,步骤S12中,对所有墨卡托坐标进行偏移,包括:用墨卡托坐标的横坐标和纵坐标分别减去基准中心的墨卡托坐标的横坐标和纵坐标。4.根据权利要求1所述的3d可视化地图生成方法,其特征在于,步骤S2,包括:步骤S21:对three.js提供的shape类进行实例化处理,得到实例化后的shape基础对象;步骤S22:通过shape基础对象提供的串联方法串联平面区域轮廓坐标,生成封闭可拉伸的shape对象,获得封闭区域平面轮廓。5.根据权利要求1所述的3d可视化地图生成方法,其特征在于,步骤S3,包括:步骤S31:配置区块三维实体所...

【专利技术属性】
技术研发人员:陈家康
申请(专利权)人:中国电子系统技术有限公司
类型:发明
国别省市:

网友询问留言 已有0条评论
  • 还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。

1