class PolylineTrailMaterial {
    constructor(option = {}) {
      this._definitionChanged = new Cesium.Event()
      this._color = undefined
      this._colorSubscription = undefined
      this._time = (new Date()).getTime()
   
      this.color = option.color ? option.color : Cesium.Color.fromCssColorString('rgba(90,90,255, 1)');
  
        this.duration = option.duration ? option.duration : 5000
      // this.img = option.img ? option.img :'/images/colors2.png'
      this.img = this.createMaterialImage()
      // 类型（会自动加载到cesium中）
      this.type = option.type ? option.type : 'PolylineTrail'
   
      // 着色器
      this.source = option.source ? option.source : 'czm_material czm_getMaterial(czm_materialInput materialInput)' +
        '{' +
        'czm_material material = czm_getDefaultMaterial(materialInput);' +
        'vec2 st = materialInput.st;' +
        'vec4 colorImage = texture2D(image, vec2(fract(st.s - time), st.t));' +
        'material.alpha = colorImage.a * color.a;' +
        'material.diffuse = (colorImage.rgb+color.rgb)/2.0;' +
        'return material;' +
        '}'
   
      this.addMaterial()
    }
    createMaterialImage(){
      var c = document.createElement("canvas");
      c.width = 512;
      c.height = 32;
      var ctx = c.getContext("2d");
      var colorstr = this.color.toCssColorString().replace("rgb(","").replace(")","");
      var my_gradient = ctx.createLinearGradient(0, 0, c.width, 0);
      my_gradient.addColorStop(0, "rgba("+colorstr+", 1)");
      my_gradient.addColorStop(1, "rgba("+colorstr+", 0)");
      ctx.fillStyle = my_gradient;
      ctx.fillRect(0, 0, c.width, c.height);
      return c.toDataURL('image/png');
    }
    getType() {
      return 'PolylineTrail'
    }
    getValue(time, result) {
      if (!Cesium.defined(result)) {
        result = {}
      }
   
      result.color = Cesium.Property.getValueOrClonedDefault(this._color, time, Cesium.Color.WHITE, result.color)
      result.image = this.img
      result.time = (((new Date()).getTime() - this._time) % this.duration) / this.duration
   
      return result
    }
    equals(other) {
      return this === other || (other instanceof PolylineTrailMaterial && Cesium.Property.equals(this._color, other._color))
    }
    addMaterial() {
      Cesium.Material._materialCache.addMaterial(this.type, {
        fabric: {
          type: this.type,
          uniforms: {
            color: new Cesium.Color(1.0, 0.0, 0.0, 0.5),
            image: this.img,
            time: 100
          },
          source: this.source
        },
   
        translucent: (material) => {
          return true
        }
      })
   
      // 注意Cesium.defineProperties会报错，需要改为Object
      Object.defineProperties(PolylineTrailMaterial.prototype, {
        isConstant: {
          get: () => {
            return false
          },
          configurable: true
        },
        definitionChanged: {
          get: () => {
            return this._definitionChanged
          },
          configurable: true
        },
        color: {
          value: Cesium.createPropertyDescriptor('color'),
          configurable: true,
          writable: true
        }
      })
    }
  }