光照概述
撰写时间：2026-07-03
修订时间：2026-07-03
概述
光源的光照射在物体上，会发生反射 (reflection)，一部分反射光进入到我们的眼睛，我们也就看到了物体。
光源的种类、颜色、位置、方向，物体的表面朝向、材质、颜色，眼睛的观察角度，均会影响所看到的最终图像。
光源的种类有：环境光 (ambient light)、方向光 (directional light)、点光 (point light)、聚光 (spot light)等。
点光是其光源位置能影响场景渲染的光源。方向光是照到所有物体上的光的方向均一样的光源，其特点是无论其光源位置在哪里，都不影响渲染结果。
法线 (normal) 是垂直于物体表面且从表面对外发射的矢量。对于在同一平面中的任意两条线段，可用矢量来表示这两条线段，且将其矢量进行叉乘 (cross product)，可计算出平面的法线。与顶点位置、颜色一样，法线也是基于顶点的数据。也就是说，每个顶点都应有位置、颜色、法线等信息。
光线反射分为环境光反射、漫反射、高光反射等。
物体的材质 (material) 一般包括光的颜色、纹理、色泽，等等。它们与光源的属性进行计算后，可得到物体最后的光影效果。
Shading model是指在哪个着色器进行着色。着色可在顶点着色器中进行，也可放在片断着色器中进行。在顶点着色器中进行着色，称为Goraud着色方法，在片断着色器中进行着色，称为Phong着色方法。Phong着色方法的光影效果更加真实、艳丽，但更耗时间与资源。为演示较好的渲染效果，这里选取Phong着色方法。
Lighting model指如何计算最终的渲染结果。由于其实质是基于物理反射原理来实现的，因此也称为反射模型 (reflection model)。
Lambertian反射模型用于计算漫反射。
在这个模型下，对于射进的光线，物体表面在每个受光位置都会全方位地产生等量的反射，即漫反射。而高光反射是只在一个角度上产生的反射。高光反射与射进的光线在同一平面上，但方向是弹离物体表面，其与法线的夹角等于入射光线与法线的夹角。
WebGL应用，就是要模拟各种光照反射的效果。虽然内容较多，但说白了，就是矩阵与矢量的运算而已。
光照关系表
| 光源 | 特点 | 入眼效果 | 着色器变量 | 影响因素 | 公式 | 备注 | |
|---|---|---|---|---|---|---|---|
| 环境光 | 光的颜色不会改变 | 昏暗的光照 | uniform vec4 uAmbient | 光源颜色，物体表面颜色 | Color | 环境光的值一般取较暗的[0.1, 0.1, 0.1, 1.0]或[0.2, 0.2, 0.2, 1.0] | |
| 方向光 | 光源距离很远，光源方向不会改变 | 1. 漫反射 | in vec3 aNormal | 光源方向，光源颜色，物体表面法线，物体表面颜色 | 总公式 | diffuse = Color | uLightDirection及aNormal必须先归一化，才能将cosθ转化为nDotL |
| uniform vec3 uLightDirection | 分式1 | float nDotL = dot(uLightDirection, aNormal) | |||||
| uniform vec3 uLightColor | 分式2 | diffuse = Color | |||||
从上表可看出，入眼效果是我们编写WebGL代码时要模拟的目标。方向光与点光都会产生漫反射与高光反射。各种光源的漫反射是一样的，但高光反射不一样。因此我们在编写代码时要清楚是哪一种光的高光反射。
最后的入眼光照效果公式为：