在cesiumjs开发中，使用Appearance来设置外观与材质，并且要考虑大量顶点渲染的时候，减少内存消耗。

设置外观

//创建几何体实例
let instance = new Cesium.GeometryInstance({
    geometry: rectGeometry,
    id: 'redRect',
    attributes: {
      color: Cesium.ColorGeometryInstanceAttribute.fromColor(
          Cesium.Color.RED.withAlpha(0.5)
      )
    }
})

//  设置外观 使用instance的颜色去着色
let appearance = new Cesium.PerInstanceColorAppearance({
    flat: true
})

// 创建图元
let primitive = new Cesium.Primitive({
    geometryInstances: instance,
    // 材质 设置外观
    appearance: appearance
})

设置材质 EllipsoidSurfaceAppearance

假定几何体与地球椭球体平行，可以在计算大量顶点属性的时候节省内存。

使用Cesium.Material.fromType来设置材质颜色。

  let material1 = new Cesium.Material.fromType("Color", {
    color: Cesium.Color.RED.withAlpha(0.5)
  })

  // 设置几何体都是与地球的椭球体平行
  let appearance = new Cesium.EllipsoidSurfaceAppearance({
    material: material1
  })

  // 创建图元
  let primitive = new Cesium.Primitive({
    geometryInstances: instance,
    // 材质 设置外观
    appearance: appearance
  })

实例演示地址

cesiumjs Appearance外观与材质

当前内容为观看threejs视频 Three.js可视化企业实战WEBGL课 课程-cesiumjs Appearance外观与材质-实践的学习笔记