WebGL学习-czm_getMaterial详解

`czm_getMaterial` 详解

czm_getMaterial 是 Cesium 渲染引擎中材质系统的核心函数，专门用于从片元着色器（Fragment Shader）中获取当前几何体的材质属性（如颜色、纹理、透明度、高光等），是 Cesium 自定义材质/着色器开发的高频API。

一、核心作用

Cesium 的材质渲染基于「材质对象 + 着色器」的组合模式：

材质对象（Material）定义了颜色、纹理、参数等数据；
czm_getMaterial 作为着色器内置函数，负责将这些数据传递到片元着色器中，供片元级别的颜色计算、纹理采样等操作使用。

二、基本用法

czm_getMaterial 必须在 Cesium 的片元着色器中调用，返回一个 czm_material 结构体（Cesium 预定义的材质数据结构）。

1. 最简示例（自定义纯色材质）

以下是一个完整的自定义材质示例，通过 czm_getMaterial 获取材质并修改片元颜色：

glsl 复制代码

// Cesium 片元着色器（Fragment Shader）
void main() {
    // 1. 获取当前材质（核心调用）
    czm_material material = czm_getMaterial(vec4(1.0)); // 参数为默认片元颜色（rgba）
    
    // 2. 使用材质属性计算最终颜色
    // material.diffuse：漫反射颜色（材质的基础颜色）
    // material.alpha：透明度
    gl_FragColor = vec4(material.diffuse, material.alpha);
}

2. 结合纹理的示例

如果材质包含纹理，czm_getMaterial 会自动关联纹理采样结果：

glsl 复制代码

void main() {
    // 获取材质（包含纹理数据）
    czm_material material = czm_getMaterial(gl_FragColor);
    
    // 采样纹理（material.diffuse 已包含纹理颜色）
    vec3 finalColor = material.diffuse * material.emission; // 漫反射 + 自发光
    gl_FragColor = vec4(finalColor, material.alpha);
}

三、`czm_material` 结构体（返回值）

czm_getMaterial 返回的 czm_material 包含以下核心属性（常用）：

属性名	类型	说明
`diffuse`	`vec3`	漫反射颜色（基础颜色/纹理采样结果）
`specular`	`vec3`	高光颜色
`shininess`	`float`	高光强度（值越大，高光区域越小）
`alpha`	`float`	透明度（0=完全透明，1=完全不透明）
`emission`	`vec3`	自发光颜色（不受光照影响）
`normal`	`vec3`	法线向量（用于法线贴图/凹凸效果）

四、实际开发场景（自定义材质）

以下是完整的 Cesium 代码示例，通过 czm_getMaterial 实现自定义渐变材质：

javascript 复制代码

// 初始化Cesium Viewer
const viewer = new Cesium.Viewer("cesiumContainer", {
  terrainProvider: Cesium.createWorldTerrain(),
});

// 定义自定义材质的着色器源码
const customMaterialSource = `
  uniform vec3 colorStart;
  uniform vec3 colorEnd;
  
  czm_material czm_getMaterial(czm_materialInput materialInput) {
    // 初始化材质
    czm_material material = czm_getDefaultMaterial(materialInput);
    
    // 基于片元的纹理坐标（v_textureCoordinates）实现渐变
    float t = materialInput.st.t; // 取纹理坐标的t分量（0~1）
    material.diffuse = mix(colorStart, colorEnd, t); // 颜色插值
    material.alpha = 0.8; // 设置透明度
    
    return material;
  }
`;

// 创建自定义材质
const customMaterial = new Cesium.Material({
  fabric: {
    type: "CustomGradient",
    uniforms: {
      colorStart: Cesium.Color.RED.rgb, // 渐变起始色（红）
      colorEnd: Cesium.Color.BLUE.rgb,  // 渐变结束色（蓝）
    },
    source: customMaterialSource, // 着色器源码
  },
});

// 创建一个矩形几何体并应用自定义材质
viewer.entities.add({
  rectangle: {
    coordinates: Cesium.Rectangle.fromDegrees(100, 30, 120, 40), // 经纬度范围
    material: customMaterial, // 应用自定义材质
    height: 10000, // 高度（10km）
  },
});

// 视角定位到几何体
viewer.camera.flyTo({
  destination: Cesium.Cartesian3.fromDegrees(110, 35, 200000),
});

五、注意事项

czm_getMaterial 只能在 Cesium 的片元着色器中调用，顶点着色器中不可用；
调用时通常需要先通过 czm_getDefaultMaterial(materialInput) 初始化默认材质，再修改属性；
材质输入参数 materialInput 包含片元的纹理坐标（st）、法线（normalEC）等关键数据，可用于复杂计算；
自定义材质时，需遵循 Cesium 的 fabric 材质规范（通过 uniforms 传递外部参数）。

总结

czm_getMaterial 是 Cesium 片元着色器中获取材质属性的核心函数，返回包含漫反射、高光、透明度等的 czm_material 结构体；
核心用途是将 Cesium 材质对象的参数传递到着色器，实现自定义颜色、纹理、渐变等视觉效果；
开发时需结合 czm_getDefaultMaterial 初始化材质，并通过 materialInput 获取片元的纹理坐标、法线等数据实现复杂逻辑。