cesium 平滑显示billboard 透明度

最新推荐文章于 2025-05-08 10:04:32 发布

原创

最新推荐文章于 2025-05-08 10:04:32 发布 · 838 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#cesium

文章介绍了在使用Cesium库加载billboard时，如何通过设置初始颜色（全透明255,255,255,0）并逐渐增加透明度实现从不显示到显示的平滑过渡效果。关键代码展示了如何使用CallbackProperty控制billboard的颜色和透明度。

描述：加载billboard的时候，要么是显示，要么是隐藏，不能平滑的显示，有个从不显示到显示的过程

解决方案：创建billboard的时候给一个color，颜色为(255,255,255)，透明度从0-1

let opacity = 0;
                let timer = setInterval(() => {
                    if (opacity < 1) {
                        opacity += 0.01;
                    } else {
                        clearInterval(timer);
                    }
                }, 20);

                viewer.entities.add({
                    position: new Cesium.Cartesian3.fromDegrees(113.392639, 38.091184, 0),
                    billboard: {
                        image: './image/img.png',
                        color: new Cesium.CallbackProperty(() =>