sdk4.0/src/Obj/Base/Road/RoadMaterialProperty.js

import Tools from "../../../Tools";

function init_material() {
  let _that = this
  let tools = new Tools()
  if (typeof Cesium !== 'undefined') (function (Cesium) {
    /**
     * 自定义材质线Property 适用于entity和primitive材质
     * @param {object} options
     * @param source {string} glsl的shader代码
     * @param options.image {string} 图片地址
     */
    function RoadMaterialProperty(options = {}, source) {

      var Color = Cesium.Color,
        defaultValue = Cesium.defaultValue,
        defineProperties = Object.defineProperties,
        Event = Cesium.Event,
        createPropertyDescriptor = Cesium.createPropertyDescriptor,
        Property = Cesium.Property,
        Material = Cesium.Material,
        MaterialType = options.MaterialType || 'wallType' + parseInt(Math.random() * 1000);

      // 创建自定义动态材质对象
      function PolylineCustomMaterialProperty(options = {}) {

        options = defaultValue(options, defaultValue.EMPTY_OBJECT);
        // 定义内置属性
        this._definitionChanged = new Event();
        this._color = undefined;
        this._colorSubscription = undefined;
        this._repeat = undefined;
        this._repeatSubscription = undefined;
        this._rotate = undefined;
        this._rotateSubscription = undefined;
        this.image = options.image;
        this.color = new Cesium.Color.fromCssColorString(options.color || "rgba(4,253,231,0.87)");
        this.repeat = options.repeat;
        this.rotate = options.rotate;
        
        this.duration = (options.duration || options.duration===0) ? options.duration : 1000
        this._time = new Date().getTime();
      }

      // 定义材质对象默认属性
      defineProperties(PolylineCustomMaterialProperty.prototype, {
        isvarant: {
          get: function () {
            return false;
          }
        },
        definitionChanged: {
          get: function () {
            return this._definitionChanged;
          }
        },
        repeat: Cesium.createPropertyDescriptor('repeat'),
        rotate: Cesium.createPropertyDescriptor('rotate'),
        color: createPropertyDescriptor('color')
      });
      // 材质对象需要有type函数 value函数 equals函数
      PolylineCustomMaterialProperty.prototype.getType = function (time) {
        return MaterialType;
      };
      PolylineCustomMaterialProperty.prototype.getValue = function (time, result) {
        if (!Cesium.defined(result)) {
          result = {};
        }
        result.color = Cesium.Property.getValueOrClonedDefault(this._color, time, Cesium.Color.WHITE, result.color);
        result.time = this.duration ? ((new Date().getTime() - this._time) % this.duration) / this.duration : 0;
        result.image = this.image;
        result.repeat = Cesium.Property.getValueOrDefault(this.repeat);
        result.rotate = Cesium.Property.getValueOrDefault(this.rotate);
        return result;
      };
      PolylineCustomMaterialProperty.prototype.equals = function (other) {
        return this === other || //
          (other instanceof PolylineCustomMaterialProperty &&
            Property.equals(this._color, other._color)) &&
          Property.equals(this.repeat, other._repeat) &&
          Property.equals(this.rotate, other._rotate)
      };
      // 将定义的材质对象添加到cesium的材质队列中
      Material._materialCache.addMaterial(MaterialType, {
        fabric: {
          type: MaterialType,
          uniforms: {
            color: new Cesium.Color(1.0, 1.0, 1.0, 1),
            image: options.image || tools.getSourceRootPath() + "/img/material/arrow.png",
            time: options.time || 0,
            repeat: new Cesium.Cartesian2(100.0, 100.0),
            rotate: 0,
          },
          // 动态材质shader
          source: `
          czm_material czm_getMaterial(czm_materialInput materialInput)
          {
              czm_material material = czm_getDefaultMaterial(materialInput);
              mat2 rotationMatrix = mat2(cos(radians(rotate)), sin(radians(rotate)), -sin(radians(rotate)), cos(radians(rotate)));
              vec2 st = repeat * materialInput.st*rotationMatrix;
              vec4 colorImage = texture2D(image, vec2(fract(st.s - time), st.t));
              material.alpha = colorImage.a;
              material.diffuse = colorImage.rgb*1.0;
              return material;
          }`,
          components: {
            specular: 10.0,
            diffuse: "vec3(0.5)"
          },
        },
        // 透明
        translucent: function (material) {
          return true;
        }
      })
      return new PolylineCustomMaterialProperty(options);
    }

    Cesium.RoadMaterialProperty = RoadMaterialProperty;
  })(Cesium);

}

export { init_material }