cesium加载wms wmts tms服务和加载xyz切片

 1加载tms服务

// 添加TMS切片图层
viewer.imageryLayers.addImageryProvider(new Cesium.UrlTemplateImageryProvider({
    url : 'https://example.com/tms/{z}/{x}/{y}.png'
}));

 tip:

 如果tms不是标准的服务的话,可以在https://example.com/tms/{z}/{x}/{-y}.png  y的前面加个负号试试,因为加载xyz切片有些区别主要是cesium只能加载xyz服务 而xyz和tms服务的区别在于一个

起点在左上角 一个在左下角,所以他们的转换就是在y坐标加负号(个人理解)

2加载wms服务

   viewer.imageryLayers.addImageryProvider(new Cesium.WebMapServiceImageryProvider({
            url : 'https://example.com/wms',
            layers : 'layerName',
            parameters : {
                service : 'WMS',
                format : 'image/png',
                transparent : true
            }
        }));

• url：WMS服务的URL。
• layers：要显示的图层名称。
• parameters：附加的参数，如service、format和transparent。

 3加载wmts服务

       // 添加WMTS图层
        viewer.imageryLayers.addImageryProvider(new Cesium.WebMapTileServiceImageryProvider({
            url : 'https://example.com/wmts',
            layer : 'layerName',
            style : 'default',
            format : 'image/png',
            tileMatrixSetID : 'EPSG:3857',
            maximumLevel : 18
        }));

• url：WMTS服务的URL。
• layer：WMTS图层名称。
• style：样式名称。
• format：图像格式，例如image/png。
• tileMatrixSetID：瓦片矩阵集的ID，通常是坐标参考系统（CRS），如EPSG:3857。
• maximumLevel：最大缩放级别。

需要把wmts的url中的{TileMatrix}改为{TileMatrixSet}:{TileMatrix}

4加载xyz 

 // 添加XYZ切片图层
        viewer.imageryLayers.addImageryProvider(new Cesium.UrlTemplateImageryProvider({
            url : 'https://example.com/xyz/{z}/{x}/{y}.png'
        }));

5加载geojson服务

// 创建GeoJsonDataSource实例
        const geoJsonDataSource = new Cesium.GeoJsonDataSource();

        // 加载GeoJSON数据
        geoJsonDataSource.load('https://example.com/data.geojson').then(function() {
            viewer.dataSources.add(geoJsonDataSource);

6再补充一个加载3dtiles 的方法
 

tip:好像新版本换了个方法在此案例后面 

const set3Dtitle3 = () => {
  let translation = Cesium.Cartesian3.fromArray([0, 0, 0]);
  let m = Cesium.Matrix4.fromTranslation(translation);
  const url = "http://data.mars3d.cn/3dtiles/max-fsdzm/tileset.json";
  let tilesetJson = {
    url,
    modelMatrix: m,
    show: true, // 是否显示图块集(默认true)
    skipLevelOfDetail: true, // --- 优化选项。确定是否应在遍历期间应用详细级别跳过(默认false)
  };
  const tileset = new Cesium.Cesium3DTileset(tilesetJson);
  viewer.flyTo(tileset);
  // 异步加载
  tileset.readyPromise
    .then(function (tileset) {
      viewer.scene.primitives.add(tileset);
    })
    .catch(function (error) {
      console.log(error);
    });
  tileset.allTilesLoaded.addEventListener(function () {
    console.log("模型已经全部加载完成");
  });
}

如下是新版本方法(应该实在 1.107 版本之后,具体不确定都可以试试哪种方法可以加载) 

//新版本方法
const tileset = await Cesium.Cesium3DTileset.fromUrl('http://localhost:3333/data/tileset.json');
        viewer.scene.primitives.add(tileset);
        
        // Optional: Adjust the camera to view the tileset
        viewer.camera.viewBoundingSphere(tileset.boundingSphere, new Cesium.HeadingPitchRange(0, -0.5, 0));