开源方案搭建可离线的精美矢量切片地图服务-1.开篇(附成果演示地址)html
开源方案搭建可离线的精美矢量切片地图服务-2.PostGIS+GeoServer矢量切片 node
开源方案搭建可离线的精美矢量切片地图服务-3.Mapbox个性化地图定制入门工具
开源方案搭建可离线的精美矢量切片地图服务-4.Mapbox样式设计字体
开源方案搭建可离线的精美矢量切片地图服务-5.Mapbox离线项目实现ui
开源方案搭建可离线的精美矢量切片地图服务-6.Mapbox之.pbf字体库阿里云
开源方案搭建可离线的精美矢量切片地图服务-7.Arcgis Pro企业级应用spa
开源方案搭建可离线的精美矢量切片地图服务-8.mapbox 之sprite大图图标文件生成(附源码)设计
02:德国-德累斯顿市:http://test.sharegis.cn/mapbox/html/6germany.htmlcode
.pbf全称Protocal Buffers,是Google公司开发的一种数据描述语言,相似于XML可以将结构化数据序列化,可用于数据存储、通讯协议等方面。简单来讲就是结构简单、速度快,咱们前面讲到的矢量切片也使用了这种格式。orm
咱们常见的字体库例如微软雅黑的.ttf字体文件大约有15M,一次请求加载15M而且还要解析,对服务端和客户端的压力都大,因此Mapbox使用了.pbf的格式进行分批请求,下面是两种格式的对比。.pbf格式大大的减小了请求压力。
1.使用node-fontnik工具进行转换,具体参考https://www.jianshu.com/p/23634e54487e这篇文章。
2.使用Arcgis pro进行转换,Arcgis pro包含基于Mapbox企业级的矢量切片方案,要收费,可是有20天试用,你们能够试一下,我会在下篇进行详细分析。我本身使用的本身就是经过这种方式获取的。
我在一些Mapbox群里,你们离线部署Mapbox js遇到最主要的问题就是字体库弄不下来,这里我分享几个经常使用字体库。
SimSun Regular(宋体):https://pan.baidu.com/s/1lv69EP5QlaUnlKZlH4-qlA
Microsoft YaHei Regular(雅黑):https://pan.baidu.com/s/1-tJr-PpKSFRxlfhWwtc0Kw
Microsoft YaHei Bold:https://pan.baidu.com/s/1Ls1hgLIbcu5impJ086x5DQ
Arial Regular:https://pan.baidu.com/s/102-e8pYKB2CO9bvP3LvWug
字体引用
style 中添加请求路径,fontstack就是字体文件夹的名称,range就是文件名,这些请求Mapbox会自动给咱们完成。
"glyphs": "../fonts/{fontstack}/{range}.pbf",
具体给symbol添加字体的方式
{ //郊区 "id": "place-suburb", "type": "symbol", "source": "germany", "source-layer": "gis_osm_places_07_1", "minzoom": 10, "maxzoom": 16, "filter": [ "==", "fclass", "suburb" ], "layout": { "text-field": "{name}", "text-transform": "uppercase", "text-font": [ //这个就是{fontstack},也就是字体文件夹的名称 "Microsoft YaHei" ], "text-letter-spacing": 0.15, "text-max-width": 7, "text-padding": 3, "text-size": { "base": 1, "stops": [ [ 11, 11 ], [ 15, 18 ] ] } }, "paint": { "text-halo-color": "hsl(0, 0%, 100%)", "text-halo-width": 1, "text-color": "hsl(230, 29%, 35%)", "text-halo-blur": 0.5 }, "interactive": true },
本文主要分享了一些适用Mapbox 的.pbf字体库,下篇咱们主要讲一下企业级Arcgis Pro 发布矢量切片服务的方法,他会将Mapbox所需的全部离线文件生成。能够借鉴一下企业级服务是如何构建的。
待续。。。。。。。。。。。。。。。。。。。。。
做者:ATtuing
出处:http://www.cnblogs.com/ATtuing
本文版权归做者和博客园共有,欢迎转载,但未经做者赞成必须保留此段声明,且在文章页面明显位置给出原文连接。