Cesium加载Geoserver发布的WMS、WMTS、TMS
2019-03-16 本文已影响4人
WebGiser
Geoserver发布地图服务比较简单,这里不做赘述。
1、Cesium加载Geoserver发布的WMS服务
(1)登录Geoserver,点击Layer Preview按钮,在右侧某个图层点击OpenLayers按钮。
![](https://img.haomeiwen.com/i11354300/6153dc61958bff57.png)
(2)在打开的页面中查看wms服务需要的参数
![](https://img.haomeiwen.com/i11354300/6fc635c9f8f1a035.png)
(3)cesium加载wms服务
var viewer = new Cesium.Viewer('cesiumContainer');
var wmsImageryProvider = new Cesium.WebMapServiceImageryProvider({
url : 'http://localhost:8080/geoserver/shp/wms',
layers : 'shp:wafangdianshi_0',
parameters : {
transparent : true, //是否透明
format : 'image/png',
srs: 'EPSG:4326',
styles:''
}
});
viewer.imageryLayers.addImageryProvider(wmsImageryProvider);
(4)效果
![](https://img.haomeiwen.com/i11354300/e7ff2916554374ef.png)
2、Cesium加载Geoserver发布的WMTS服务
(1)登录Geoserver,点击GeoServer图标按钮,在右侧WMTS下点击1.0.0按钮。
![](https://img.haomeiwen.com/i11354300/4f06f9b78b72ffe2.png)
(2)搜索想要加载的wmts服务名称,找到我们需要的几个Identifier,分别是layerID、styleID、TileMatrixSetID,另外需要位于当前layer标签尾部的ResourceUrl。
![](https://img.haomeiwen.com/i11354300/3a3c4d57547a5b31.png)
![](https://img.haomeiwen.com/i11354300/019a46ce620f427b.png)
(3)查看wmts服务
![](https://img.haomeiwen.com/i11354300/2c9b85bf2179f83a.png)
![](https://img.haomeiwen.com/i11354300/7b77c8301152b235.png)
(4)选择获取tile对象的ResourceURL,style是图层样式,TileMatrixSet是采用瓦片数据集格式,TileMatrix(url需要将{TileMatrix}改为{TileMatrixSet}:{TileMatrix})代表缩放级别,TileRow和TileCol代表着瓦片坐标。
(5)cesium加载wmts服务
var viewer = new Cesium.Viewer('cesiumContainer');
var wmtsImageryProvider = new Cesium.WebMapTileServiceImageryProvider({
url : 'http://localhost:8080/geoserver/gwc/rest/wmts/wzf:wafangdianshi_0/{style}/{TileMatrixSet}/{TileMatrixSet}:{TileMatrix}/{TileRow}/{TileCol}?format=image/png',
layer : 'wzf:wafangdianshi_0',
style : '',
format : 'image/png',
tileMatrixSetID:'EPSG:900913'
});
viewer.imageryLayers.addImageryProvider(wmtsImageryProvider);
(6)效果
![](https://img.haomeiwen.com/i11354300/2b84e493407e3bdd.png)