尝试一下在线预览默认情况下， WebScene 具有逼真的天空，具有大气、星星和背景中的黑色以模拟空间。 这非常适用于具有逼真可视化效果的 web 场景 ，例如 带纹理的建筑物群, 集成网格图层 或 具有 RGB 符号的点云 。
主题可视化与世界的抽象表示相得益彰，因此大多数时候背景颜色比现实的天空更合适。 在其他时候，您希望将地球与您的网页集成，因此您需要透明背景。 此示例向您展示了如何做到这一点。
1. 用自定义颜色替换天空
SceneView.environment 中的背景属性可用于设置自定义颜色。 气氛在高缩放级别和本地网络场景中覆盖了背景颜色，因此禁用它很重要。 这是此的代码片段：
1
2
3
4
5
6
7
8
9
10
11
12
13
14
const view = new SceneView({
container: "viewDiv",
map: map,
environment: {
background: {
type: "color", // autocasts as new ColorBackground()
color: [255, 252, 244, 1]
},
// disable stars
starsEnabled: false,
//disable atmosphere
atmosphereEnabled: false
}
});
2. 使天空透明
要使天空透明，首先需要将 背景颜色 的 alpha 值设置为 0 。然后通过将 SceneView.alphaCompositingEnabled 属性设置为 true来启用视图的透明度。此属性只能在构建时设置一次。 启用 Alpha 合成后，Web 场景的性能可能会降低。 仅当您需要在视图上应用透明度时，才将此属性设置为 true 很重要。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
const view = new SceneView({
container: "viewDiv",
map: map,
// enable transparency on the view
alphaCompositingEnabled: true,
environment: {
background: {
type: "color", // autocasts as new ColorBackground()
// set the color alpha to 0 for full transparency
color: [255, 252, 244, 0]
},
// disable stars
starsEnabled: false,
//disable atmosphere
atmosphereEnabled: false
}
});
3. 其他：改变地面颜色
有时您并不需要底图。 默认情况下，禁用底图时，网格会显示为地面。现在您可以使用 Ground.surfaceColor 属性将地面更改为以单一颜色显示：
1
2
3
4
5
6
const webscene = new WebScene({
basemap: null,
ground: {
surfaceColor: [226, 240, 255]
}
});