在进行WebGL开发时,有时候我们希望能够做更多绚丽的效果,例如希望将三维球的天空盒子修改为黑色,或者是将天空盒子透明。
首先我们来看两个效果
效果一:三维球背景纯黑色
效果二:三维球天空盒子透明,背景颜色依赖于下一层的div,可以是渐变色,或者图片。本图效果用了渐变色
透明的天空盒子
一、背景纯黑的设置
viewer.scene.skyBox.show=false;
一句话就能搞定,别这么看着我,就是这么简单!
二、将天空盒子透明
viewer = new Cesium.Viewer("cesiumContainer", {
//设置为了去掉天空盒子/////
orderIndependentTranslucency: false,
contextOptions: {
webgl: {
alpha: true
}
}
});
scene = viewer.scene;
scene.skyBox.show = false;
scene.backgroundColor = new Cesium.Color(0.0, 0.0, 0.0, 0.0);
设置contextOptions就能搞定,其中orderIndependentTranslucency需要设置为true,才能去掉地球表面的大气效果的黑圈问题,赶紧试试吧!
三、去掉三维地球
viewer.scene.globe.show=false;
viewer.scene.skyAtmosphere.show=false;
文末彩蛋:
$(".cesium-widget-credits").hide();
这句代码可以去掉SuperMap的这个红色logo
logo
修改地下颜色
viewer.scene.undergroundMode = true;
viewer.scene.globe.globeAlpha = 0;
viewer.scene.underGlobe.baseColor = new Cesium.Color(1.0, 1.0, 0.0, 0.0);
网友评论