Cesium 设置地形透明度

1.原始效果

2.效果展示

3.代码实现

// 初始化 Cesium Viewer
const viewer = new Cesium.Viewer('cesiumContainer', {
    terrainProvider: Cesium.createWorldTerrain()
});

// 设置地形透明度函数
function setTerrainTransparency(alpha) {
    viewer.scene.globe.translucency.enabled = true;
    viewer.scene.globe.translucency.frontFaceAlpha = alpha;
    viewer.scene.globe.translucency.backFaceAlpha = alpha;
}

// 使用示例
setTerrainTransparency(0.5); // 将地形透明度设置为0.5

// 设置相机位置以查看效果
viewer.camera.setView({
    destination: Cesium.Cartesian3.fromDegrees(-123.0744619, 44.0503706, 2000),
    orientation: {
        heading: Cesium.Math.toRadians(0.0),
        pitch: Cesium.Math.toRadians(-45.0),
        roll: 0.0
    }
});

代码解释：

1. 初始化 Cesium Viewer: 创建一个新的 Cesium Viewer 实例，并使用 createWorldTerrain 加载默认的地形数据。
2. 设置地形透明度函数: 定义一个函数 setTerrainTransparency，该函数接受透明度值（alpha）作为参数，并设置地形的前面和背面透明度。
   • viewer.scene.globe.translucency.enabled = true; 启用地形透明度。
   • viewer.scene.globe.translucency.frontFaceAlpha = alpha; 设置地形前面的透明度。
   • viewer.scene.globe.translucency.backFaceAlpha = alpha; 设置地形背面的透明度。
3. 使用示例: 调用 setTerrainTransparency 函数，将地形的透明度设置为 0.5。

这个示例代码展示了如何通过修改 globe.translucency 属性来设置地形的透明度。根据需要调整 alpha 参数来设置不同的透明度值。