【Mars3d 学习】材质类型

       材质会让我们的业务需求变的简单，比如一条虚线，一条发光线，一张图片面，以及棋盘格，波纹扩散等等；

        1、创建的对象支不支持材质呢？

需要查看API --- PointEntity - Mars3D API文档 这里我以point点对象为例，很明显，Api里没有写材质，说明点不支持材质的设置；

PolylineEntity - Mars3D API文档  这个是线对象，标明了materialType，说明是支持材质类型的；

        2、要怎么知道mars3d中的材质对象

具体的可以查看API -- MaterialType - Mars3D API文档 这样我们就能找到我们所需要的类型，如果没有的话，或者效果达不到预期，那么久需要自定义材质了；

        3、如何绘制带有材质的对象？

这里就以线对象为例，写个流动图片：

const graphic = new mars3d.graphic.PolylineEntity({
    positions: [
      [117.169646, 31.769171],
      [117.194579, 31.806466]
    ],
    style: {
      width: 5,
      materialType: mars3d.MaterialType.LineFlow,
      materialOptions: {
        color: "#00ff00",
        image: "img/textures/line-pulse.png",
        speed: 3
      }
    }
  })
  graphicLayer.addGraphic(graphic)

graphic.flyTo() // 定位到矢量对象

        4、现有的材质不能满足需求，如何自定义材质呢？

这个就需要懂一些额外的知识了，或者付费让他们开发

// 注册自定义材质
const LineSpriteType = "LineSprite"
mars3d.MaterialUtil.register(LineSpriteType, {
  fabric: {
    uniforms: {
      image: Cesium.Material.DefaultImageId,
      speed: 20,
      globalAlpha: 1.0
    },
    source: `czm_material czm_getMaterial(czm_materialInput materialInput)
      {
        czm_material material = czm_getDefaultMaterial(materialInput);
        vec2 st = materialInput.st;
        vec4 colorImage = texture(image, vec2(fract(st.s - speed*czm_frameNumber/1000.0), st.t));
        material.alpha = colorImage.a * globalAlpha;
        material.diffuse = colorImage.rgb * 1.5 ;
        return material;
      }`
  },
  translucent: true
})

  const graphic = new mars3d.graphic.PolylinePrimitive({
    positions: [
      [117.261209, 31.919032, 20.7],
      [117.279865, 31.893017, 15.3],
      [117.26716, 31.874204, 19.3]
    ],
    style: {
      width: 1.7,
      // 使用自定义材质
      materialType: LineSpriteType,
      materialOptions: {
        image: "./img/textures/line-sprite.png",
        speed: 10
      }
    }
  })
  graphicLayer.addGraphic(graphic)