上一节我们学习了cesiumjs primitive材质类型与设置，这一节我们来学习cesiumjs fabric自定义着色器设置材质.

fabric 设置图片类型

// 图片类型
  let material1 = new Cesium.Material({
    fabric: {
      type: "Image",
      uniforms: {
        image: './vite.svg'
      }
    }
  })

着色器设置

  let material1 = new Cesium.Material({
    fabric: {
      uniforms: {
        uTime: 0,
      },
      source: `
        czm_material czm_getMaterial(czm_materialInput materialInput)
        {
          // 生成默认的基础材质
          czm_material material = czm_getDefaultMaterial(materialInput);
          // material.diffuse = vec3(materialInput.st+uTime, 0.0);
          float strength = mod((materialInput.s-uTime) * 10.0, 1.0);
          material.diffuse = vec3(strength, 0.0, 0.0);
          return material;
        }
      `,
    },
  });

实例演示地址

cesiumjs fabric自定义着色器设置材质

当前内容为观看threejs视频 Three.js可视化企业实战WEBGL课 课程-cesiumjs fabric自定义着色器设置材质-实践的学习笔记

实例代码下载

代码运行环境：vue3 + vite + js nodejs 14