Cesium添加geojson数据及WMS在线图层服务

地图初始化及geojson数据

html部分

<div id="GlobeView"></div>


css
#GlobeView{
  position: absolute
  width: 100%
  height: 100%
}

JS部分

let viewer = new Cesium.Viewer("GlobeView", {
        // 添加天地图影像底图
        imageryProvider: new Cesium.WebMapTileServiceImageryProvider({
            url: TDT_IMG_W,
            layer: "tdtVecBasicLayer",
            style: "default",
            format: "image/jpeg",
            tileMatrixSetID: "GoogleMapsCompatible"
        })
      });
      // 添加天地图标注
      viewer.imageryLayers.addImageryProvider(new Cesium.WebMapTileServiceImageryProvider({ 
          url: TDT_CIA_W,
          layer: "tdtAnnoLayer",
          style: "default",
          format: "image/jpeg",
          tileMatrixSetID: "GoogleMapsCompatible"
      }))

        // 照相机视角跳转到中国
      viewer.camera.flyTo({
        destination: Cesium.Cartesian3.fromDegrees(103.84, 31.15, 17850000),
        orientation: {
          heading :  Cesium.Math.toRadians(348.4202942851978),
          pitch : Cesium.Math.toRadians(-89.74026687972041),
          roll : Cesium.Math.toRadians(12)
        }
      });
        // 添加geoJson数据
      viewer.dataSources.add(
        Cesium.GeoJsonDataSource.load(
          "/data/xian.json",
          {
            stroke: Cesium.Color.CORAL,
            fill: Cesium.Color.CHOCOLATE.withAlpha(0.5), //如果把0.5改成0 则填充色设置为空
            strokeWidth: 3,
          }
        )
      );

添加WMS在线图层服务

let wmsProvider = new Cesium.WebMapServiceImageryProvider({
          url : '服务地址',
          layers : '发布服务上的图层名称',
          parameters: {
            service : 'WMS',
            format: 'image/png',
            transparent: true,
          }  
      })
 
      viewer.imageryLayers.addImageryProvider(wmsProvider);

WMTS服务

let wmtsyProvider = new Cesium.WebMapTileServiceImageryProvider({
          url : '服务地址',
          layer : '图层名称',
          style : '',
          format : 'image/png',
          tileMatrixSetID:'EPSG:4326'      坐标系
      });
      viewer.imageryLayers.addImageryProvider(wmtsyProvider);