GeoServer发布mapbox vector tile (MVT)并在地图上展示（符号化）
mapbox vector tiles（MVT）发布的方式有几种，用商业GIS可以发布（国产XX图就支持）、用开源GIS也支持（如GeoServer）。
下载GeoServer，下载插件
geoserver-2.14.1-vectortiles-plugin
geoserver-2.14.1-wps-plugin
拷贝到geoserver\WEB-INF\lib即可
重启GeoServer即可
使用geoserver发布图层，以四川省地图为例
发布省界、市界、县界、市点位、县点位、镇点位、村点位、高速、国道、省道、县道（等道路）、河流、绿地等。
每个图层都需要在Tile Caching 勾选 mapbox-vector-tile
建立图层组，比如TestSC,将相关图层添加到图层组
配置地图符号：
根据mapbox的标准配置
"layers":
[{
"id": "cityregion/1",
"type": "fill",
"source": "esri",
"source-layer": "cityregion",
"layout": {},
"paint": {
"fill-color": "#091220"
}
}, {
"id": "ZhiBei",
"type": "fill",
"source": "esri",
"source-layer": "ZhiBei",
"layout": {},
"paint": {
"fill-color": "#0E1B30"
}
}, {
"id": "ShuiXiPolygon",
"type": "fill",
"source": "esri",
"source-layer": "ShuiXiPolygon",
"layout": {},
"paint": {
"fill-color": "#113549"
}
}, {
"id": "QitaDaolu/0",
"type": "line",
"source": "esri",
"source-layer": "QitaDaolu",
"minzoom": 14.51,
"layout": {
"line-cap": "round",
"line-join": "round"
},
"paint": {
"line-color": "#12223D",
"line-width": 2.4
}
}, {
"id": "XiangZhenDaoLu/0",
"type": "line",
"source": "esri",
"source-layer": "XiangZhenDaoLu",
"minzoom": 11.15,
"layout": {
"line-cap": "round",
"line-join": "round"
},
"paint": {
"line-color": "#12223D",
"line-width": {
"stops": [
[11.15, 0.688172],
[11.53, 1.37634],
[13.59, 2.75269],
[14.85, 3.44086],
[15.85, 4.12903]
]
}
}
}, {
"id": "XianDao/0",
"type": "line",
"source": "esri",
"source-layer": "XianDao",
"minzoom": 8.58,
"layout": {
"line-join": "round"
},
"paint": {
"line-color": "#12223D",
"line-width": {
"stops": [
[5.89, 2.13333],
[8.58, 2.06452],
[9.21, 3.44086],
[11.53, 4.12903],
[13.59, 6.19355],
[18.17, 6.88172]
]
}
}
}, {
"id": "ShengDao/0",
"type": "line",
"source": "esri",
"source-layer": "ShengDao",
"layout": {
"line-join": "round"
},
"paint": {
"line-color": "#12223D",
"line-width": {
"stops": [
[1.56, 2.66667],
[5.89, 3.80952],
[9.21, 4.57143],
[12.53, 5.33333],
[14.85, 6.09524],
[18.17, 6.85714]
]
}
}
}, {
"id": "GuoDao/0",
"type": "line",
"source": "esri",
"source-layer": "GuoDao",
"layout": {
"line-join": "round"
},
"paint": {
"line-color": "#12223D",
"line-width": 3.06667
}
}, {
"id": "CityHighway/0",
"type": "line",
"source": "esri",
"source-layer": "CityHighway",
"layout": {
"line-join": "round"
},
"paint": {
"line-color": "#12223D",
"line-width": {
"stops": [
[3.89, 1.90476],
[5.89, 2.85714],
[8.21, 3.80952],
[9.21, 4.7619],
[11.53, 5.71429],
[12.53, 6.66667],
[18.17, 7.61905]
]
}
}
},
{
"id": "HighWay/0",
"type": "line",
"source": "esri",
"source-layer": "HighWay",
"layout": {
"line-join": "round"
},
"paint": {
"line-color": "#12223D",
"line-width": {
"stops": [
[3.89, 1.90476],
[5.89, 2.85714],
[8.21, 3.80952],
[9.21, 4.7619],
[11.53, 5.71429],
[12.53, 6.66667],
[18.17, 7.61905]
]
}
}
}, {
"id": "TieLu/1",
"type": "line",
"source": "esri",
"source-layer": "TieLu",
"layout": {
"line-join": "round"
},
"paint": {
"line-color": "#12223D",
"line-width": 2.66667
}
}, {
"id": "TieLu/0",
"type": "line",
"source": "esri",
"source-layer": "TieLu",
"layout": {
"line-join": "round"
},
"paint": {
"line-color": "#123C52",
"line-width": 1.06663
}
}, {
"id": "QitaDaolu/label/Class 1",
"type": "symbol",
"source": "esri",
"source-layer": "QitaDaolu",
"minzoom": 15.59,
"layout": {
"symbol-placement": "line",
"text-font": ["Microsoft YaHei Regular"],
"text-size": 13.3333,
"text-max-width": 8,
"text-field": "{PathName}",
"text-optional": true
},
"paint": {
"text-color": "#979C9A"
}
}, {
"id": "XiangZhenDaoLu/label/Class 1",
"type": "symbol",
"source": "esri",
"source-layer": "XiangZhenDaoLu",
"minzoom": 14.51,
"layout": {
"symbol-placement": "line",
"text-font": ["Microsoft YaHei Regular"],
"text-size": 13.3333,
"text-max-width": 8,
"text-field": "{PathName}",
"text-optional": true
},
"paint": {
"text-color": "#979C9A"
}
}, {
"id": "XianDao/label/Class 1",
"type": "symbol",
"source": "esri",
"source-layer": "XianDao",
"minzoom": 15.15,
"layout": {
"symbol-placement": "line",
"text-font": ["Microsoft YaHei Regular"],
"text-size": 13.3333,
"text-max-width": 8,
"text-field": "{PathName}",
"text-optional": true
},
"paint": {
"text-color": "#2DC4BB"
}
}, {
"id": "ShengDao/label/Class 1",
"type": "symbol",
"source": "esri",
"source-layer": "ShengDao",
"minzoom": 14.51,
"layout": {
"symbol-placement": "line",
"text-font": ["Microsoft YaHei Regular"],
"text-size": 13.3333,
"text-max-width": 8,
"text-field": "{PathName}",
"text-optional": true
},
"paint": {
"text-color": "#2DC4BB"
}
}, {
"id": "GuoDao/label/Class 1",
"type": "symbol",
"source": "esri",
"source-layer": "GuoDao",
"minzoom": 9.87,
"layout": {
"symbol-placement": "line",
"text-font": ["Microsoft YaHei Regular"],
"text-size": 13.3333,
"text-max-width": 8,
"text-field": "{PathName}",
"text-optional": true
},
"paint": {
"text-color": "#2DC4BB"
}
},
{
"id": "CityHighway/label/Class 1",
"type": "symbol",
"source": "esri",
"source-layer": "CityHighway",
"minzoom": 9.36,
"layout": {
"symbol-placement": "line",
"text-font": ["Microsoft YaHei Regular"],
"text-size": 13.3333,
"text-max-width": 8,
"text-field": "{PathName}",
"text-optional": true
},
"paint": {
"text-color": "#2DC4BB"
}
},
{
"id": "HighWay/label/Class 1",
"type": "symbol",
"source": "esri",
"source-layer": "HighWay",
"minzoom": 9.36,
"layout": {
"symbol-placement": "line",
"text-font": ["Microsoft YaHei Regular"],
"text-size": 13.3333,
"text-max-width": 8,
"text-field": "{PathName}",
"text-optional": true
},
"paint": {
"text-color": "#2DC4BB"
}
}, {
"id": "TieLu/label/Class 1",
"type": "symbol",
"source": "esri",
"source-layer": "TieLu",
"minzoom": 11.27,
"layout": {
"symbol-placement": "line",
"text-font": ["Microsoft YaHei Regular"],
"text-size": 13.3333,
"text-max-width": 8,
"text-field": "{Name}",
"text-optional": true
},
"paint": {
"text-color": "#979C9A"
}
}, {
"id": "citypoint/Class 1",
"type": "symbol",
"source": "esri",
"source-layer": "citypoint",
"layout": {
"text-font": ["Microsoft YaHei Regular"],
"text-size": 13.3333,
"text-anchor": "bottom",
"text-max-width": 8,
"text-field": "{Name}",
"text-optional": true
},
"paint": {
"text-color": "#2DC4BB",
"text-halo-color": "rgba(255,255,255,0.12)",
"text-halo-width": 1.33333
}
}, {
"id": "XianPoint",
"type": "symbol",
"source": "esri",
"source-layer": "XianPoint",
"minzoom": 7.94,
"layout": {
"icon-image": "XianPoint",
"icon-allow-overlap": true,
"text-font": ["Microsoft YaHei Regular"],
"text-size": 13.3333,
"text-anchor": "center",
"text-max-width": 8,
"text-field": "{Name}",
"text-optional": true
},
"paint": {
"text-color": "#2DC4BB"
}
}, {
"id": "XianZhen",
"type": "symbol",
"source": "esri",
"source-layer": "XianZhen",
"minzoom": 9.98,
"layout": {
"icon-image": "XianZhen",
"icon-allow-overlap": true,
"text-font": ["Microsoft YaHei Regular"],
"text-size": 13.3333,
"text-anchor": "bottom",
"text-max-width": 8,
"text-field": "{Name}",
"text-optional": true
},
"paint": {
"text-color": "#2DC4BB"
}
}, {
"id": "Cun",
"type": "symbol",
"source": "esri",
"source-layer": "Cun",
"minzoom": 15.45,
"layout": {
"icon-image": "Cun",
"icon-allow-overlap": true,
"text-font": ["Microsoft YaHei Regular"],
"text-size": 13.3333,
"text-anchor": "bottom-left",
"text-max-width": 8,
"text-field": "{Name}",
"text-optional": true
},
"paint": {
"text-color": "#000000"
}
}, {
"id": "WeiShengSheBao",
"type": "symbol",
"source": "esri",
"source-layer": "WeiShengSheBao",
"minzoom": 15.85,
"layout": {
"icon-image": "WeiShengSheBao",
"icon-allow-overlap": true,
"text-font": ["Microsoft YaHei Regular"],
"text-size": 13.3333,
"text-anchor": "bottom-left",
"text-max-width": 8,
"text-field": "{Name}",
"text-optional": true
},
"paint": {
"text-color": "#2DC4BB"
}
}, {
"id": "JiaoYuWenHua",
"type": "symbol",
"source": "esri",
"source-layer": "JiaoYuWenHua",
"minzoom": 15.85,
"layout": {
"icon-image": "JiaoYuWenHua",
"icon-allow-overlap": true,
"text-font": ["Microsoft YaHei Regular"],
"text-size": 13.3333,
"text-anchor": "bottom",
"text-max-width": 8,
"text-field": "{Name}",
"text-optional": true
},
"paint": {
"text-color": "#2DC4BB"
}
}, {
"id": "ZhuSu",
"type": "symbol",
"source": "esri",
"source-layer": "ZhuSu",
"minzoom": 15.85,
"layout": {
"icon-image": "ZhuSu",
"icon-allow-overlap": true,
"text-font": ["Microsoft YaHei Regular"],
"text-size": 13.3333,
"text-anchor": "bottom",
"text-max-width": 8,
"text-field": "{Name}",
"text-optional": true
},
"paint": {
"text-color": "#2DC4BB"
}
}]
在地图中如何符号化展示，以mapboxgl为例
var simple = {
"version": 8,
"sprite": "http://" + window.location.host + "/examples/data/mbstyle/ArcTilerMapBlueV3/sprites/sprite",
"glyphs": "http://" + window.location.host + "/examples/data/mbstyle/ArcTilerMapBlueV3/fonts/{fontstack}/{range}.pbf",
"sources": {
"composite": {
"url": "mapbox://mapbox.mapbox-terrain-v2",
"type": "vector"
},
"esri": {
"type": "vector",
"scheme": "tms",
"tiles": [
"http://localhost:8080/arctilerserver/gwc/service/tms/1.0.0/KylinWS:TestSC@EPSG:900913@pbf/{z}/{x}/{y}.pbf"
]
},
},"layers":
[{
"id": "cityregion/1",
"type": "fill",
"source": "esri",
"source-layer": "cityregion",
"layout": {},
"paint": {
"fill-color": "#091220"
}
}, {
"id": "ZhiBei",
"type": "fill",
"source": "esri",
"source-layer": "ZhiBei",
"layout": {},
"paint": {
"fill-color": "#0E1B30"
}
}, {
"id": "ShuiXiPolygon",
"type": "fill",
"source": "esri",
"source-layer": "ShuiXiPolygon",
"layout": {},
"paint": {
"fill-color": "#113549"
}
}, {
"id": "QitaDaolu/0",
"type": "line",
"source": "esri",
"source-layer": "QitaDaolu",
"minzoom": 14.51,
"layout": {
"line-cap": "round",
"line-join": "round"
},
"paint": {
"line-color": "#12223D",
"line-width": 2.4
}
}, {
"id": "XiangZhenDaoLu/0",
"type": "line",
"source": "esri",
"source-layer": "XiangZhenDaoLu",
"minzoom": 11.15,
"layout": {
"line-cap": "round",
"line-join": "round"
},
"paint": {
"line-color": "#12223D",
"line-width": {
"stops": [
[11.15, 0.688172],
[11.53, 1.37634],
[13.59, 2.75269],
[14.85, 3.44086],
[15.85, 4.12903]
]
}
}
}, {
"id": "XianDao/0",
"type": "line",
"source": "esri",
"source-layer": "XianDao",
"minzoom": 8.58,
"layout": {
"line-join": "round"
},
"paint": {
"line-color": "#12223D",
"line-width": {
"stops": [
[5.89, 2.13333],
[8.58, 2.06452],
[9.21, 3.44086],
[11.53, 4.12903],
[13.59, 6.19355],
[18.17, 6.88172]
]
}
}
}, {
"id": "ShengDao/0",
"type": "line",
"source": "esri",
"source-layer": "ShengDao",
"layout": {
"line-join": "round"
},
"paint": {
"line-color": "#12223D",
"line-width": {
"stops": [
[1.56, 2.66667],
[5.89, 3.80952],
[9.21, 4.57143],
[12.53, 5.33333],
[14.85, 6.09524],
[18.17, 6.85714]
]
}
}
}, {
"id": "GuoDao/0",
"type": "line",
"source": "esri",
"source-layer": "GuoDao",
"layout": {
"line-join": "round"
},
"paint": {
"line-color": "#12223D",
"line-width": 3.06667
}
}, {
"id": "CityHighway/0",
"type": "line",
"source": "esri",
"source-layer": "CityHighway",
"layout": {
"line-join": "round"
},
"paint": {
"line-color": "#12223D",
"line-width": {
"stops": [
[3.89, 1.90476],
[5.89, 2.85714],
[8.21, 3.80952],
[9.21, 4.7619],
[11.53, 5.71429],
[12.53, 6.66667],
[18.17, 7.61905]
]
}
}
},
{
"id": "HighWay/0",
"type": "line",
"source": "esri",
"source-layer": "HighWay",
"layout": {
"line-join": "round"
},
"paint": {
"line-color": "#12223D",
"line-width": {
"stops": [
[3.89, 1.90476],
[5.89, 2.85714],
[8.21, 3.80952],
[9.21, 4.7619],
[11.53, 5.71429],
[12.53, 6.66667],
[18.17, 7.61905]
]
}
}
}, {
"id": "TieLu/1",
"type": "line",
"source": "esri",
"source-layer": "TieLu",
"layout": {
"line-join": "round"
},
"paint": {
"line-color": "#12223D",
"line-width": 2.66667
}
}, {
"id": "TieLu/0",
"type": "line",
"source": "esri",
"source-layer": "TieLu",
"layout": {
"line-join": "round"
},
"paint": {
"line-color": "#123C52",
"line-width": 1.06663
}
}, {
"id": "QitaDaolu/label/Class 1",
"type": "symbol",
"source": "esri",
"source-layer": "QitaDaolu",
"minzoom": 15.59,
"layout": {
"symbol-placement": "line",
"text-font": ["Microsoft YaHei Regular"],
"text-size": 13.3333,
"text-max-width": 8,
"text-field": "{PathName}",
"text-optional": true
},
"paint": {
"text-color": "#979C9A"
}
}, {
"id": "XiangZhenDaoLu/label/Class 1",
"type": "symbol",
"source": "esri",
"source-layer": "XiangZhenDaoLu",
"minzoom": 14.51,
"layout": {
"symbol-placement": "line",
"text-font": ["Microsoft YaHei Regular"],
"text-size": 13.3333,
"text-max-width": 8,
"text-field": "{PathName}",
"text-optional": true
},
"paint": {
"text-color": "#979C9A"
}
}, {
"id": "XianDao/label/Class 1",
"type": "symbol",
"source": "esri",
"source-layer": "XianDao",
"minzoom": 15.15,
"layout": {
"symbol-placement": "line",
"text-font": ["Microsoft YaHei Regular"],
"text-size": 13.3333,
"text-max-width": 8,
"text-field": "{PathName}",
"text-optional": true
},
"paint": {
"text-color": "#2DC4BB"
}
}, {
"id": "ShengDao/label/Class 1",
"type": "symbol",
"source": "esri",
"source-layer": "ShengDao",
"minzoom": 14.51,
"layout": {
"symbol-placement": "line",
"text-font": ["Microsoft YaHei Regular"],
"text-size": 13.3333,
"text-max-width": 8,
"text-field": "{PathName}",
"text-optional": true
},
"paint": {
"text-color": "#2DC4BB"
}
}, {
"id": "GuoDao/label/Class 1",
"type": "symbol",
"source": "esri",
"source-layer": "GuoDao",
"minzoom": 9.87,
"layout": {
"symbol-placement": "line",
"text-font": ["Microsoft YaHei Regular"],
"text-size": 13.3333,
"text-max-width": 8,
"text-field": "{PathName}",
"text-optional": true
},
"paint": {
"text-color": "#2DC4BB"
}
},
{
"id": "CityHighway/label/Class 1",
"type": "symbol",
"source": "esri",
"source-layer": "CityHighway",
"minzoom": 9.36,
"layout": {
"symbol-placement": "line",
"text-font": ["Microsoft YaHei Regular"],
"text-size": 13.3333,
"text-max-width": 8,
"text-field": "{PathName}",
"text-optional": true
},
"paint": {
"text-color": "#2DC4BB"
}
},
{
"id": "HighWay/label/Class 1",
"type": "symbol",
"source": "esri",
"source-layer": "HighWay",
"minzoom": 9.36,
"layout": {
"symbol-placement": "line",
"text-font": ["Microsoft YaHei Regular"],
"text-size": 13.3333,
"text-max-width": 8,
"text-field": "{PathName}",
"text-optional": true
},
"paint": {
"text-color": "#2DC4BB"
}
}, {
"id": "TieLu/label/Class 1",
"type": "symbol",
"source": "esri",
"source-layer": "TieLu",
"minzoom": 11.27,
"layout": {
"symbol-placement": "line",
"text-font": ["Microsoft YaHei Regular"],
"text-size": 13.3333,
"text-max-width": 8,
"text-field": "{Name}",
"text-optional": true
},
"paint": {
"text-color": "#979C9A"
}
}, {
"id": "citypoint/Class 1",
"type": "symbol",
"source": "esri",
"source-layer": "citypoint",
"layout": {
"text-font": ["Microsoft YaHei Regular"],
"text-size": 13.3333,
"text-anchor": "bottom",
"text-max-width": 8,
"text-field": "{Name}",
"text-optional": true
},
"paint": {
"text-color": "#2DC4BB",
"text-halo-color": "rgba(255,255,255,0.12)",
"text-halo-width": 1.33333
}
}, {
"id": "XianPoint",
"type": "symbol",
"source": "esri",
"source-layer": "XianPoint",
"minzoom": 7.94,
"layout": {
"icon-image": "XianPoint",
"icon-allow-overlap": true,
"text-font": ["Microsoft YaHei Regular"],
"text-size": 13.3333,
"text-anchor": "center",
"text-max-width": 8,
"text-field": "{Name}",
"text-optional": true
},
"paint": {
"text-color": "#2DC4BB"
}
}, {
"id": "XianZhen",
"type": "symbol",
"source": "esri",
"source-layer": "XianZhen",
"minzoom": 9.98,
"layout": {
"icon-image": "XianZhen",
"icon-allow-overlap": true,
"text-font": ["Microsoft YaHei Regular"],
"text-size": 13.3333,
"text-anchor": "bottom",
"text-max-width": 8,
"text-field": "{Name}",
"text-optional": true
},
"paint": {
"text-color": "#2DC4BB"
}
}, {
"id": "Cun",
"type": "symbol",
"source": "esri",
"source-layer": "Cun",
"minzoom": 15.45,
"layout": {
"icon-image": "Cun",
"icon-allow-overlap": true,
"text-font": ["Microsoft YaHei Regular"],
"text-size": 13.3333,
"text-anchor": "bottom-left",
"text-max-width": 8,
"text-field": "{Name}",
"text-optional": true
},
"paint": {
"text-color": "#000000"
}
}, {
"id": "WeiShengSheBao",
"type": "symbol",
"source": "esri",
"source-layer": "WeiShengSheBao",
"minzoom": 15.85,
"layout": {
"icon-image": "WeiShengSheBao",
"icon-allow-overlap": true,
"text-font": ["Microsoft YaHei Regular"],
"text-size": 13.3333,
"text-anchor": "bottom-left",
"text-max-width": 8,
"text-field": "{Name}",
"text-optional": true
},
"paint": {
"text-color": "#2DC4BB"
}
}, {
"id": "JiaoYuWenHua",
"type": "symbol",
"source": "esri",
"source-layer": "JiaoYuWenHua",
"minzoom": 15.85,
"layout": {
"icon-image": "JiaoYuWenHua",
"icon-allow-overlap": true,
"text-font": ["Microsoft YaHei Regular"],
"text-size": 13.3333,
"text-anchor": "bottom",
"text-max-width": 8,
"text-field": "{Name}",
"text-optional": true
},
"paint": {
"text-color": "#2DC4BB"
}
}, {
"id": "ZhuSu",
"type": "symbol",
"source": "esri",
"source-layer": "ZhuSu",
"minzoom": 15.85,
"layout": {
"icon-image": "ZhuSu",
"icon-allow-overlap": true,
"text-font": ["Microsoft YaHei Regular"],
"text-size": 13.3333,
"text-anchor": "bottom",
"text-max-width": 8,
"text-field": "{Name}",
"text-optional": true
},
"paint": {
"text-color": "#2DC4BB"
}
}]
}
var map = new mapboxgl.Map({
container: 'map',
style: simple,
zoom: 8,
center: [104.07898, 30.66147]
});
地图效果
转载自：https://blog.csdn.net/GIS_Lyn/article/details/87908982
