C2——cesium添加扩散圆环

GIS兵墩墩

已于 2022-04-10 12:14:21 修改

阅读量4k

点赞数 3

分类专栏： Cesium 文章标签： Cesium

于 2020-10-13 17:17:02 首次发布

GIS-TeZhanBing

本文链接：https://blog.youkuaiyun.com/qq_24641385/article/details/109056039

版权

Cesium 专栏收录该内容

31 篇文章

订阅专栏

这篇博客介绍如何利用Cesium的CallbackProperty动态改变椭圆的大小，创建视觉效果。通过调整半径并设置回调函数，使得椭圆在100的范围内不断缩放，形成动态的圆环效果。此外，还提到了可以使用类似的方法实现圆环动态效果，为标签添加更多动感。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

需求：有时候只添加一个lable会先得比较单调这时候给lable加上一些动销会好看得多。

思路：用cesium的ellipse来绘制圆；用回调函数来动态改变圆的大小。效果如下：

上代码：

let r1 = 50;
let r2 = 50;

viewer.entities.add({
    id: quality.id,
    position: Cesium.Cartesian3.fromDegrees(position),
    billboard: {
        image: 'imgUrl',
        width: 40,
        height: 40,
        horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
        verticalOrigin: Cesium.HorizontalOrigin.Bottom,
    },
    ellipse: {
        semiMinorAxis: new Cesium.CallbackProperty(function () {
            r1 = r1 + 0.5;
            if (r1 >= 100) {
                r1 = 0;
            }
            return r1;
        }, false),
        semiMajorAxis: new Cesium.CallbackProperty(function () {
            r2 = r2 + 0.5;
            if (r2 >= 100) {
                r2 = 0;
            }
            return r2;
        }, false),
        height: _center[2] + 1,
        material: new Cesium.ImageMaterialProperty({
            image: imageUrl,
            repeat: new Cesium.Cartesian2(1.0, 1.0),
            transparent: true,
            color: Cesium.Color.WHITE.withAlpha(1),
        })
    }
})

拓展：也可以用圆环来写。