Cesium 加载 ArcGIS WMTS服务

(1)场景:使用Cesium加载ArcGIS的WMTS瓦片服务

最近在项目中需要使用Cesium添加ArcGIS的WMTS服务,虽然根据网上的相关资料加载成功,但是还是遇到一些参数调整相关的问题,所以将过程中的一些步骤心得记录下来。

(2)查看服务相关参数

网上的资料主要借鉴 cesium加载arcgis 发布的 CGCS2000坐标系的WMTS地图服务_A873054267的博客-CSDN博客  

这里以该文章中的服务地址为例   wzmap/map (MapServer)

点击服务中的 WMTS ,查看相关参数,实际上也就是访问 http://61.175.211.102/arcgis/rest/services/wzmap/map/MapServer/WMTS/1.0.0/WMTSCapabilities.xml 查找相关参数信息

相关参数信息见下面各图片标记;

Cesium 加载 ArcGIS WMTS服务_第1张图片

2.1 图层标识(名称)

Cesium 加载 ArcGIS WMTS服务_第2张图片

2.2 style名称

Cesium 加载 ArcGIS WMTS服务_第3张图片

2.3 ..

Cesium 加载 ArcGIS WMTS服务_第4张图片

2.4 tileMatrix

Cesium 加载 ArcGIS WMTS服务_第5张图片

2.5 模板URL (重要)

注意不同的服务这里的模板URL有一定差别,请在 WMTSCapabilities.xml 中查看各服务自己的 URL进行调用

Cesium 加载 ArcGIS WMTS服务_第6张图片

(3)代码展示

地球加载

// 初始化三维球视图
var viewer = new Cesium.Map('cesiumContainer');

添加定位点,方便查看服务是否加载

// 添加定位
viewer.entities.removeAll();
var positions = viewer.entities.add({
    name: 'position',
    position: Cesium.Cartesian3.fromDegrees(120.58468164419833, 27.842148925776648, 10000),
    point: {
        pixelSize: 5,
        color: Cesium.Color.RED,
        outlineColor: Cesium.Color.WHITE,
        outlineWidth: 2
    }
});
viewer.zoomTo(positions);

加载服务

// 添加ArcGIS WMTS服务
var provider = new Cesium.WebMapTileServiceImageryProvider({
    url: 'http://61.175.211.102/arcgis/rest/services/wzmap/map/MapServer/WMTS/tile/1.0.0/wzmap_map/{Style}/{TileMatrixSet}/{TileMatrix}/{TileRow}/{TileCol}.png', // 复制 2.5 中的地址
    layer: 'wzmap_map',
    style: 'default',
    tileMatrixSetID: 'default028mm',
    format: 'image/png',
    tilingScheme: new Cesium.GeographicTilingScheme(),
    maximumLevel: 21,                
    tileMatrixLabels: ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10', '11', '12', '13', '14', '15', '16', '17', '18', '19', '20', '21'] // 对应2.4中的tileMatrix Identifier属性
});
// 添加服务图层到视图中
viewer.imageryLayers.addImageryProvider(provider);

(4)效果如图:

Cesium 加载 ArcGIS WMTS服务_第7张图片

(5)总结

小结几个比较重要的点:

『1』通过服务的 WMTSCapabilities.xml  查看需要的相关参数

『2』在代码部分添加服务的时候,如果是采用模板URL的方式进行加载,有些参数实际上可以省略,比如 layer,style等,因为URL中已经包含了相关属性

『3』如果不能正常加载,可能存在的问题   

  • 第一肯定还是要仔细对照  WMTSCapabilities.xml  中的相关参数看是否正确;
  • 模板地址要正确;
  • 可能是 tileMatrixLabels 属性的问题。我遇到的问题就是使用二维地图(mapboxgl)能够正常加载,但是三维地图不能正常加载,对比二维地图和三维地球中的单个瓦片地址,修改 tileMatrixLabels 数组从 0 开始,解决了问题,即
    tileMatrixLabels: ['0','1', '2', '3', '4', '5', '6', '7', '8', '9', '10', '11', '12', '13', '14', '15', '16', '17', '18', '19', '20', '21']
    具体原因待研究。

你可能感兴趣的:(cesium,javascript,canvas,uni-app)