思路
- 通过地图下载器、OSM、百度云、GIS数据服务网站等资源获取矢量数据
- 通过Geoserver发布矢量切片服务(具体见之前的文章)
- 通过开源工具
spritezero cli
或者java代码制作雪碧图 - 通过开源工具
node-fontnik
制作字体pbf文件 - 通过开源工具
Maputnik
本地化编辑地图样式,生成style.json文件 - Mapbox加载style.json数据实现本地化处理
难点
除了第3点和第4点不熟悉之外,其它的都已经自己动手实现过。这两点使用的spritezero cli
和node-fontnik
开源工具只适合在linux系统部署,因为我不熟悉,所以暂放。
具体可参考文末链接。
要点
矢量切片制作与发布
- 关于Geoserver的,可以见之前学过的博客
- PostGIS也能发布矢量切片服务,待研究
Maputnik的使用
本地化处理
-
github链接:https://github.com/maputnik/editor
-
下载本地版本:https://github.com/maputnik/editor/wiki/Maputnik-CLI
https://github.com/maputnik/editor/releases/tag/v1.7.0
有对应的windows版本文件 -
在线版本:https://maputnik.github.io/editor
弊端就是,在线添加的第三方链接需要https协议,否则无法发布,而本地版本,可以使用http协议
本地版的使用注意事项
添加Source时,按照mapbox支持的矢量切片链接的格式来就行
Tile URL示例:
"http://localhost:8080/geoserver/gwc/service/tms/1.0.0/webgis%3Ashanghai_full@EPSG%3A3857@pbf/{z}/{x}/{y}.pbf"
添加图层
Source
要与之前AddSource时填写的Source ID名称一致。
Source Layer
要与矢量切片发布时的对应图层名称一致。
否则找不到图层,无法在地图上展示。
因为,Mapbox加载矢量切片时,使用的scheme
是tms
,而Maputnik Editor
没有对应的选项,需要自己在添加图层后,先导出Style文件,添加scheme后,再重新导入,这样,自己发布的地图数据才能在Maputnik中正常使用,否则会出现偏移。