Skip to content

自己写一个最小 Lambert

本节我们进入“看起来像 3D”的关键:光照。Three.js 的 MeshStandardMaterial 已经内置了复杂的 PBR 光照模型,但要理解 WebGL,你需要至少能自己写出一个最小可用的漫反射模型。

目标

  • 理解 Lambert 漫反射的核心公式:max(dot(N, L), 0.0)
  • 明确 N(法线)与 L(光照方向)必须是单位向量
  • 用一个简单的环境光项避免背光面全黑

思路

  1. 从几何体得到法线 normal,并转换到合适的空间(本例使用世界空间法线)。
  2. 给定光照方向 uLightDir(单位向量)。
  3. 计算漫反射强度:
glsl
float diff = max(dot(N, L), 0.0);
  1. 最终颜色叠加一个环境光系数 uAmbient
glsl
color = baseColor * (uAmbient + diff);

动手练习

  • 修改 uLightDir 的方向(例如把 y 改小),观察亮面位置如何变化
  • uAmbient 改为 0.00.3,理解环境光的作用
  • 尝试把 diff 改为 pow(diff, 2.0),观察高光区的分布变化(这不是物理正确,但很常用)

小结

你已经能够从法线与光照方向构建最小光照模型。下一节我们将学习后处理:把场景渲染到纹理,再对纹理进行二次处理。