矢量瓦片诞生的意义在于互补栅格瓦片的不足,栅格瓦片是目前使用最广、技术成熟的底图技术。随着应用的不断升级,栅格瓦片的局限性越来越凸显。
栅格瓦片面临的问题:
- 栅格瓦片体积大
- 栅格瓦片创建效率低
- 更改配图方案需要重新创建栅格瓦片
- 栅格瓦片底图对高分辨率显示屏支持不足
矢量瓦片的优势:
- 矢量瓦片创建效率高
- 矢量瓦片传输和渲染速度快
- 矢量瓦片数据和风格样式独立,更改配图方案无需重新创建瓦片
- 矢量瓦片具有高显示质量,能够很好地支持高分辨率显示屏
下面附上SuperMap栅格瓦片和矢量瓦片的各自特点,方便您合理选择瓦片类型用作底图。
矢量瓦片 |
栅格瓦片 |
|
瓦片形式 |
mvt文件 |
图片文件 |
瓦片格式 |
Google Protocol Buffers数据序列化格式 |
png、jpg、png8等 |
瓦片内容 |
瓦片对应范围的地图矢量数据的坐标和字段 |
瓦片对应范围的地图内容输出的图片 |
基于MapBox样式规范的瓦片风格 |
||
瓦片结构 |
瓦片按照层级和行列号分文件夹存储 |
|
采用全球剖分层级比例尺创建瓦片 |
可自定义层级比例尺创建瓦片 |
|
瓦片大小 |
大小与瓦片对应范围的矢量地图数据量的大小有关,数据量大,瓦片文件就大 |
图片文件大小 |
瓦片存储 |
支持原始缓存、紧凑缓存以及存储在MongoDB数据库 |
矢量瓦片底图是一种结合了栅格瓦片底图和矢量底图优势的底图技术,具有客户端灵活绘制、渲染,分块加载减少请求数量的优点。目前,已经采用矢量瓦片底图技术的组织有ESRI、MapBox、MAPZEN、OpenStreetMap、百度地图、SuperMap。
下面就来说一说SuperMap的矢量瓦片解决方案。
图:SuperMap矢量瓦片结构
SuperMap的矢量瓦片使用全球剖分网格,像建金字塔的方式,对矢量地图数据进行分层分块,然后,使用 .mvt自定义文件格式(遵循MapBox MVT规范的矢量瓦片描述文件)存储分块内的数据描述信息,并生成瓦片风格文件,如上图所示。矢量瓦片发布到服务端后,客户端请求到矢量瓦片后,通过解析样式来动态渲染矢量瓦片并拼接成底图。完成上述矢量瓦片的生成、发布和使用的全过程,需要多个SuperMap系列产品相互配合。
图:矢量瓦片应用相关的SuperMap系列产品
首先,将矢量数据加载到SuperMap iDesktop中进行矢量地图制作,或者使用已有的地图数据。不过,地图风格的一些设置需要注意,原因是:SuperMap根据MapBox GL 版本 8的样式规范生成矢量瓦片风格文件,而MapBox风格显示表达与SuperMap存在差异,所以个别SuperMap的系统符号以及图层风格MapBox不支持,在地图配图时,建议您采用替代方案规避。
除此之外,矢量地图的复杂度将会影响创建矢量瓦片的性能,如要素包含的子对象过多等,建议制作矢量地图时尽量降低数据的复杂度。
关于如何制作一幅适合高效创建矢量瓦片底图的地图,请参见《创建矢量瓦片之制图最佳实践》。
准备好矢量地图后,在SuperMap iDesktop直接可以创建矢量瓦片,只需简单地设置层级比例尺、范围等参数。这里,您可以使用多进程高效创建矢量瓦片,矢量瓦片的存储类型也支持多种:原始缓存、紧凑缓存,也可以将矢量瓦片写入MongoDB数据库。
创建的矢量瓦片可以通过SuperMap iDesktop提供的入口浏览,也可以通过SuperMap iServer 发布为地图服务,再通过SuperMap iClient客户端显示浏览。
目前,SuperMap iClient支持MapBox GL和OpenLayers两种渲染显示效果。其中,OpenLayers支持多种投影的矢量瓦片渲染显示,而MapBox GL只支持渲染显示EPSG3857投影的矢量瓦片。
图:MapBox GL EPSG3857投影矢量瓦片显示
图:OpenLayers EPSG3857投影矢量瓦片显示
图:OpenLayers EPSG4326投影矢量瓦片显示
矢量瓦片的最大特点之一就是瓦片数据与风格独立,因此,能够通过修改瓦片的风格来改变矢量瓦片底图的配图方案,无需重新创建矢量瓦片。
矢量瓦片的风格文件style.json位于“矢量缓存目录/Styles/”目录下,所使用的点、线、面符号等资源存储在“矢量缓存目录/ sprites”目录下。
修改矢量瓦片风格可以通过以下途径:
一、直接修改style.json样式文件,此方式并不易用,不建议使用。
二、通过SuperMap iDesktop重新创建矢量瓦片风格,然后将新创建的矢量瓦片风格内容替换到待更新风格的矢量缓存目录即可。
图:重新创建矢量瓦片风格
三、SuperMap Online目前提供了矢量瓦片底图服务,您也可以通过SuperMap Online,使用SuperMap iPortal内置的矢量瓦片风格修改WebApp在线修改矢量瓦片风格。
图:iPortal内置的修改矢量瓦片风格的WebApp