sdk4.0/src/Obj/Materail/CircleRippleMaterialProperty.js

/*
 * @Description: 波纹圆效果
 */
export default class CircleDiffuseMaterialProperty {

  constructor(options) {
    if (!CircleDiffuseMaterialProperty.prototype.hasOwnProperty('color')) {
      Object.defineProperties(CircleDiffuseMaterialProperty.prototype, {
        color: Cesium.createPropertyDescriptor("color"),
      });
    }
    if (!CircleDiffuseMaterialProperty.prototype.hasOwnProperty('speed')) {
      Object.defineProperties(CircleDiffuseMaterialProperty.prototype, {
        speed: Cesium.createPropertyDescriptor("speed"),
      });
    }
    if (!CircleDiffuseMaterialProperty.prototype.hasOwnProperty('transparency')) {
      Object.defineProperties(CircleDiffuseMaterialProperty.prototype, {
        transparency: Cesium.createPropertyDescriptor("transparency"),
      });
    }
    if (!CircleDiffuseMaterialProperty.prototype.hasOwnProperty('count')) {
      Object.defineProperties(CircleDiffuseMaterialProperty.prototype, {
        count: Cesium.createPropertyDescriptor("count"),
      });
    }
    if (!CircleDiffuseMaterialProperty.prototype.hasOwnProperty('gradient')) {
      Object.defineProperties(CircleDiffuseMaterialProperty.prototype, {
        gradient: Cesium.createPropertyDescriptor("gradient"),
      });
    }
    this._definitionChanged = new Cesium.Event();
    this._speed = undefined;
    this.id = options.id;
    this.color = options.color || new Cesium.Color(1.0, 1.0, 1.0, 1.0);
    this.colors = options.colors || {};
    this.speed = options.speed;
    this.transparency = options.transparency;
    this.count = options.count;
    this.gradient = options.gradient;
    let _sourceColor = ``
    let ratio = []
    for (const key in this.colors) {
      if (Object.hasOwnProperty.call(this.colors, key)) {
        ratio.push(key)
      }
    }
    ratio.sort((a, b) => b - a)
    for (let i = 0; i < ratio.length; i++) {
      let color = this.colors[ratio[i]]
      _sourceColor = _sourceColor + `
        if(dis < float(${Number(ratio[i]) / 2})) {
          material.diffuse = 1.5 * vec4(${color.red},${color.green},${color.blue},${color.alpha}).rgb;
        }
        `
    }
    this._source = `
      uniform vec4 color;
      uniform float speed;
      uniform float count;
      uniform float gradient;
      uniform float transparency;
      uniform float frameNumber;

      czm_material czm_getMaterial(czm_materialInput materialInput)
      {
        czm_material material = czm_getDefaultMaterial(materialInput);
        material.diffuse = 1.5 * color.rgb;
        vec2 st = materialInput.st;
        float dis = distance(st, vec2(0.5, 0.5));
        float per = fract(frameNumber * speed / 30000.0);
        vec3 str = materialInput.str;
        if(abs(str.z)  > 0.001){
          discard;
        }
        if(dis > 0.5){
          discard;
        }else {
          ${_sourceColor}
          float perDis = 0.5 / count;
            float disNum;
            float bl = 0.0;
            for(int i = 0; i <= 99; i++){
              if(float(i) <= count){
                disNum = perDis * float(i) - dis + per / count;
                if(disNum > 0.0){
                  if(disNum < perDis){
                    bl = 1.0 - disNum / perDis;
                  }
                  else if(disNum - perDis < perDis){
                    bl = 1.0 - abs(1.0 - disNum / perDis);
                  }
                  material.alpha = pow(bl,(1.0 + 10.0 * (1.0 - gradient))) * transparency;
                }
              }
            }
        }
        return material;
      }
    `
    this._CircleRippleMaterialType = "CircleRippleMaterialType" + this.id;
    Cesium.Material._materialCache.addMaterial(
      this._CircleRippleMaterialType,
      {
        fabric: {
          type: this._CircleRippleMaterialType,
          uniforms: {
            color: new Cesium.Color(1.0, 0.0, 0.0, 1.0),
            speed: 3.0,
            transparency: 1,
            count: 4,
            gradient: 0.2,
            frameNumber:  Cesium.getTimestamp(),
          },
          source: this._source,
        },
        translucent: function (material) {
          return true;
        },
      }
    );
  }

  get isConstant() {
    return false;
  }

  get definitionChanged() {
    return this._definitionChanged;
  }

  getType(time) {
    return this._CircleRippleMaterialType;
  }

  getValue(time, result) {
    if (!Cesium.defined(result)) {
      result = {};
    }
    result.color = Cesium.Property.getValueOrDefault(
      this._color,
      time,
      Cesium.Color.RED,
      result.color
    );
    result.speed = Cesium.Property.getValueOrDefault(
      this._speed,
      time,
      10,
      result.speed
    );
    result.transparency = this.transparency;
    result.count = this.count;
    result.gradient = this.gradient;
    result.frameNumber = Cesium.getTimestamp();
    return result;
  }

  equals(other) {
    return (
      this === other ||
      (other instanceof CircleRippleMaterialProperty &&
        Cesium.Property.equals(this._color, other._color) &&
        Cesium.Property.equals(this._speed, other._speed) &&
        Cesium.Property.equals(this.count, other.count) &&
        Cesium.Property.equals(this.transparency, other.transparency) &&
        Cesium.Property.equals(this.gradient, other.gradient))
    );
  }
}