[发明专利]一种在三维地图中使用MVT服务的方法

说明书

本发明公开了一种在三维地图中使用MVT服务的方法，通过创建的虚拟渲染环境和实际绘制瓦片的绑定，并通过改变地图视角而获取相应的矢量瓦片数据，在环境对象中创建数据索引树，通过索引树实时绘制瓦片。其显著效果是：实现了三维场景下矢量瓦片的加载，为二维平面数据实现了三维空间的展示。基于虚拟渲染环境和真实Canvas的映射关系，实现了动态的瓦片绘制和高效的性能缓存。

技术领域

本发明涉及到Web端三维地图数据加载与展示技术领域，具体涉及一种在三维地图中使用MVT服务的方法。

背景技术

随着WebGL技术发展，在Web端进行三维数据展示、空间分析技术日渐成熟，各种基于三维场景的应用需求也日益强烈。如何在三维场景下充分利用现有二维矢量数据，将二三维数据进行融合、展示、分析是当前三维场景下的一个重要的技术。

发明内容

针对现有技术的不足，本发明的目的是提供一种在三维地图中使用MVT服务的方法，能够实现在三维场景下充分利用现有二维矢量数据，将二三维数据进行融合、展示、分析。

为达到上述目的，本发明采用的技术方案如下：

一种在三维地图中使用MVT服务的方法，其关键在于，包括如下步骤：

步骤1、初始化三维地图场景；

步骤2、加载MVT格式的矢量瓦片数据，并获取MVT格式的数据sources地址；

步骤3、基于当前三维空间的信息计算获取不同层级的瓦片索引；

步骤4、根据三维空间的瓦片索引，计算二维空间瓦片索引；

步骤5、根据二维空间瓦片索引，计算当前可视范围内所有矢量瓦片图层并分别生成分区信息；

步骤6、创建虚拟渲染环境，以构建绘制逻辑和计算当前视角；

步骤7、加载Mapbox-gl.js前端渲染库并初始化Canvas绘制场景；

步骤8、根据二维空间瓦片索引向服务器端请求MVT格式的矢量瓦片数据；

步骤9、采用Mapbox-gl.js前端渲染库向虚拟渲染逻辑中的Canvas动态，绘制MVT格式矢量瓦片数据和样式数据；

步骤10、从Canvas动态获取绘制结果，并根据步骤5计算的可视范围内瓦片分区信息生成Canvas DOM对象；

步骤11、以图片服务形式向Cesium生成的三维地图场景绘制；

步骤12、实时侦测当前视角，动态跳转虚拟渲染环境，并实时和Canvas同步，当地图范围移动时主动销毁视域范围外的虚拟渲染逻辑Canvas内容。

进一步的，所述三维地图场景采用基于Cesium.js的WEB端开源的WebGL三维地图引擎。

进一步的，所述二维空间瓦片索引为Web墨卡托坐标系下的瓦片索引。

本发明的显著效果是：

实现了三维场景下矢量瓦片的加载，为二维平面数据实现了三维空间的展示。基于虚拟渲染环境和真实Canvas的映射关系，实现了动态的瓦片绘制和高效的性能缓存。

具体实施方式

本实施例是基于Cesium.js这一Web端开源的WebGL三维地图引擎进行三维地图的展示和处理，并通过MapboxGL的MVT解析器来处理矢量瓦片的二进制数据解析，最后通过创建虚拟渲染环境机制，来整合瓦片和三维地图的融合绘制。下面将进行相关实现原理和过程的具体描述：

一种在三维地图中使用MVT服务的方法，包括如下步骤：