效果

代码

参考了网络上一些其他特效，发现自建光效Property实现起来过程繁琐，还受到Cesium版本的限制，效果也没有想象的好。就按照自己的想象做了这个效果，牺牲了性能，但看起来自己还挺满意。

/**
 * @author: citrusrlia@foxmail.com
 * @description: 点击动态光效
 * @param {viewer:Object}
 * @return {*}
 */
let lightEffect = {
  viewer: null,
  handler: null,
  params: {
    isConstant: false,
    startTime: 0,
    startAxis: 0,
    maxendAxis: 50
  },
  init(viewer) {
    this.viewer = viewer;
    this.handler = new Cesium.ScreenSpaceEventHandler(viewer.scene.canvas);
    this.setEffect();
  },
  setEffect() {
    let that = this;
    this.handler.setInputAction(e => {
      let pickPosition = that.viewer.scene.camera.pickEllipsoid(e.position);
      that.params.startTime = Cesium.JulianDate.now();
      that.viewer.entities.removeById("lightEffect");
      let myCallback = new Cesium.CallbackProperty((time, result) => {
        let myAxis =
          that.params.startAxis +
          100 *
            Cesium.JulianDate.secondsDifference(
              Cesium.JulianDate.now(),
              that.params.startTime
            );
        if (myAxis > that.params.maxendAxis) {
          that.viewer.entities.removeById("lightEffect");
        }
        return myAxis;
      }, that.params.isConstant);
      that.viewer.entities.add({
        id: "lightEffect",
        ellipse: {
          clampToGround: true, // 与outline无法一起启用

          semiMinorAxis: myCallback,

          semiMajorAxis: myCallback,

          material: Cesium.Color.WHITE.withAlpha(0.3),
        },
        position: pickPosition
      });
    }, Cesium.ScreenSpaceEventType.LEFT_CLICK);
  },
};
export default lightEffect;

使用方式

传入当前viewer即可

import lightEffect from "lightEffect"
lightEffect.init(viewer)