Cesium添加WMS，WMTS，地形图图，3D Tiles数据

在 Cesium 中，你可以添加 WMS 、WMTS 、地形图 和 3D Tiles 数据源。以下是详细的实现方法：

1. 添加 WMS 服务

WMS（Web Map Service）是一种动态地图服务，适用于加载栅格地图图层。

代码示例

javascript 复制代码

const viewer = new Cesium.Viewer("cesiumContainer");

// 添加 WMS 图层
const wmsProvider = new Cesium.WebMapServiceImageryProvider({
    url: "https://your-wms-server.com/wms", // WMS 服务地址
    layers: "layer1,layer2", // 要加载的图层
    parameters: {
        service: "WMS",
        format: "image/png",
        transparent: true,
    },
    enablePickFeatures: false, // 是否支持点击查询
});

viewer.imageryLayers.addImageryProvider(wmsProvider);

参数说明

url：WMS 服务地址。
layers：要加载的图层名称（多个用逗号分隔）。
parameters：WMS 请求参数（如 format, transparent）。
enablePickFeatures：是否允许点击查询要素（默认 false）。

2. 添加 WMTS 服务

WMTS（Web Map Tile Service）是一种瓦片地图服务，适合加载高分辨率地图。

代码示例

javascript 复制代码

const viewer = new Cesium.Viewer("cesiumContainer");

// WMTS 配置
const wmtsProvider = new Cesium.WebMapTileServiceImageryProvider({
    url: "https://your-wmts-server.com/wmts", // WMTS 服务地址
    layer: "layer-name", // 图层名称
    style: "default", // 样式
    format: "image/png",
    tileMatrixSetID: "EPSG:3857", // 瓦片矩阵集（如 Web Mercator）
    maximumLevel: 18, // 最大缩放级别
    credit: new Cesium.Credit("Data provided by XXX"), // 数据来源声明
});

viewer.imageryLayers.addImageryProvider(wmtsProvider);

参数说明

url：WMTS 服务地址。
layer：要加载的图层名称。
tileMatrixSetID：瓦片矩阵集（如 EPSG:3857 或 EPSG:4326）。
maximumLevel：最大缩放级别（影响加载的瓦片分辨率）。

3. 添加地形数据

Cesium 支持加载 全球地形 或 自定义地形（如 Cesium World Terrain）。

（1）使用 Cesium World Terrain（默认全球地形）

javascript 复制代码

const viewer = new Cesium.Viewer("cesiumContainer", {
    terrainProvider: Cesium.createWorldTerrain(), // 使用 Cesium 全球地形
});

（2）加载自定义地形（如 STK 地形）

javascript 复制代码

const customTerrainProvider = new Cesium.CesiumTerrainProvider({
    url: "https://your-terrain-server.com/terrain", // 地形服务地址
    requestVertexNormals: true, // 是否请求顶点法线（用于光照效果）
    requestWaterMask: true, // 是否请求水面效果
});

const viewer = new Cesium.Viewer("cesiumContainer", {
    terrainProvider: customTerrainProvider,
});

（3）本地地形数据（如 quantized-mesh）

javascript 复制代码

const localTerrainProvider = new Cesium.CesiumTerrainProvider({
    url: "./data/terrain", // 本地地形数据路径
});

const viewer = new Cesium.Viewer("cesiumContainer", {
    terrainProvider: localTerrainProvider,
});

4. 加载 3D Tiles

3D Tiles 是 Cesium 的 3D 数据标准 ，适用于加载 倾斜摄影、BIM、点云 等数据。

（1）加载 3D Tiles 模型

javascript 复制代码

const viewer = new Cesium.Viewer("cesiumContainer");

const tileset = viewer.scene.primitives.add(
    new Cesium.Cesium3DTileset({
        url: "https://your-3dtiles-server.com/tileset.json", // tileset.json 路径
        maximumScreenSpaceError: 2, // 渲染质量（数值越小越精细）
        dynamicScreenSpaceError: true, // 动态调整加载精度
        dynamicScreenSpaceErrorDensity: 0.00278, // 密度控制
    })
);

// 定位到 3D Tiles
viewer.zoomTo(tileset);

（2）调整 3D Tiles 样式

javascript 复制代码

tileset.style = new Cesium.Cesium3DTileStyle({
    color: {
        conditions: [
            ["${Height} >= 100", "color('red')"],
            ["${Height} >= 50", "color('yellow')"],
            ["true", "color('blue')"],
        ],
    },
});

（3）控制 3D Tiles 显隐

javascript 复制代码

tileset.show = false; // 隐藏
tileset.show = true;  // 显示

总结

数据类型	Cesium 加载方式	适用场景
WMS	`WebMapServiceImageryProvider`	动态地图服务
WMTS	`WebMapTileServiceImageryProvider`	瓦片地图服务
地形数据	`CesiumTerrainProvider`	全球/自定义地形
3D Tiles	`Cesium3DTileset`	3D 模型、BIM、点云

常见问题

WMS/WMTS 加载失败？
- 检查 url 是否正确，确保服务支持 CORS。
- 确认 layers 或 tileMatrixSetID 参数是否正确。
3D Tiles 加载慢？
- 调整 maximumScreenSpaceError 降低渲染质量。
- 使用 Cesium3DTileset 的 preloadWhenHidden 预加载。
地形不显示？
- 确保 terrainProvider 正确设置。
- 检查地形数据路径或服务是否可用。