Cesium 加载GeoServer WMTS 服务

前提

• Cesium
• GeoServer
• GeoWebCache

查看GeoServer 的服务能力

在GeoServer欢迎页面中，在右侧有服务能力列表
点击 WMTS，查看发布的WMTS服务列表
如果遇到如下情况，则需要重新载入列表：
在 Caching Defaults 下，打开GWC的主页
点击 A list of all the layers and automatic demos

在最下面，点击 Reload TileLayerConfiguration

重新读取后，就能显示WMTS的服务列表啦
是这样滴：

在该图层的最下面有WMTS的REST 方式的 url
使用Cesium 的WebMapTileServiceImageryProvider 函数加载WMTS影像

初始代码（加载不出来）

var smart = new Cesium.WebMapTileServiceImageryProvider({
    url : 'http://localhost:5080/geoserver/gwc/service/wmts/rest/xxx:lll/{style}/{TileMatrixSet}/{TileMatrix}/{TileRow}/{TileCol}?format=image/png',
    layer : 'xxx:lll',
    style : '',
    format : 'image/png',
    tileMatrixSetID : 'EPSG:4326',
    maximumLevel: 20
  })

• 在这段代码中，url中的style、TileMatrixSet、TileMatrix、TileRow、TileCol个人理解为占位符。分别对应：
  • style —— 样式
  • TileMatrixSet 坐标系
  • TileMatrix 层级
  • TileRow 行数
  • TileCol 列数
• layer 是GeoServer 的图层名
  在载入的过程中，报了很多很多的400错误。
  
  本着好奇的原则，将那个请求网址单独拎出来访问下，看看结果是什么
  EPSG:4326 未知。。然后查看了两位大佬的博客：

Cesium调用 ArcGIS Server 以及 GeoServer 发布的地图服务
https://blog.csdn.net/weixin_40161953/article/details/80971167

Cesium调用geoserver2.14发布的WMTS瓦片
https://blog.csdn.net/Coveragehe/article/details/88369314?utm_source=app

• 以此修改代码，将url 占位符中 {TileMatrix} 修改为 {TileMatrixSet}:{TileMatrix}
• url如下：

http://localhost:5080/geoserver/gwc/service/wmts/rest/xxx:lll/{style}/{TileMatrixSet}/{TileMatrix}/{TileRow}/{TileCol}?format=image/png

• 不知道大家的是不是这样，在发布切片的时候，并没有指定 style ，也就是说样式是默认值，则在设定函数对象参数的时候，并不能将style 定义为 default 。也不能不对 style 进行定义，个人理解为有占位符。所以在这里我们将 style 定义为空就可以了。
• 代码如下（还是不能显示）：

 var smart = new Cesium.WebMapTileServiceImageryProvider({
    url : 'http://localhost:5080/geoserver/gwc/service/wmts/rest/xxx:lll/{style}/{TileMatrixSet}/{TileMatrixSet}:{TileMatrix}/{TileRow}/{TileCol}?format=image/png',
    layer : 'xxx:lll',
    style : '',
    format : 'image/png',
    tileMatrixSetID : 'EPSG:4326',
    tileMatrixLabels : ['EPSG:4326:0', 'EPSG:4326:1', 'EPSG:4326:2' ...],
    maximumLevel: 20
  })

• 在运行，这个时候我发现还是出不来
• 再次查看结果，发现如下：
  
• 我使用的Cesium 版本是 1.53 ，
• Cesium的层级加载方式是：[1,2,3,4,5,6]，而GeoServer的加载方式是：[“EPSG:4326:8”]。
• 并对tileMatrixSetID ，坐标系进行修改，修改为EPSG:900913

最终代码

let viewer = new Cesium.Viewer('cesiumContainer', {
    scene3DOnly: true,
    timeline: false,
    animation: false,
    vrButton: false,
    baseLayerPicker: true,
    infoBox: true,
    credtiContainer: 'credit',
    fullscreenButton: false
  })
  // cesium 下方介绍等
  viewer._cesiumWidget._creditContainer.style.display = "none"
  viewer.baseLayerPicker.viewModel.selectedImagery = viewer.baseLayerPicker.viewModel.imageryProviderViewModels[3]

  // Example 2. USGS shaded relief tiles (RESTful)
  var smart = new Cesium.WebMapTileServiceImageryProvider({
    url : 'http://localhost:5080/geoserver/gwc/service/wmts/rest/xxx:lll/{style}/{TileMatrixSet}/{TileMatrixSet}:{TileMatrix}/{TileRow}/{TileCol}?format=image/png',
    layer : 'xxx:lll',
    style : '',
    format : 'image/png',
    tileMatrixSetID : 'EPSG:900913',
    maximumLevel: 20
  })

  viewer.imageryLayers.addImageryProvider(smart)
  viewer.camera.flyTo({ //设置视角
    destination: Cesium.Cartesian3.fromDegrees(114.5915, 36.6551, 100)
  })

• 查阅了源码，我发现，初始的谷歌地球（也包括必应、ArcGIS Online） 都是用的是 3857坐标系，也就是 900913坐标系。
• 因此我自己总结出几条没有不成功的原因：

1. 发布的时候使用3857，
2. 一般发布切片的时候，默认都会有900913坐标系。
3. 配置参数时，使用900913坐标系，目测4326需要转坐标系（只限WMTS）。
4. 不过。。还不知道为什么WMS不改坐标系也可以直接显示出来。

此篇记录研究过程，如有错误，欢迎指出。