Babylon.js 8.x 中文文档整理——Light篇

Part 1 Light介绍

1. Light概述

现实中，物体通常不会主动发出光线，而是通过接收光源照射，例如太阳光、月光，对光线进行反射、吸收等物理过程，最终形成我们看到的效果。

在三维渲染中，Light光照系统就是用于简化模拟现实世界中的光线效果，通过计算光线与物体表面的交互关系，生成最终画面上的像素颜色。

需要注意的是，三维场景中的可见性并不完全依赖Light，如果物体材质存在自发光Emissive可以不依靠外部官员直接产生颜色表现，但对于大多数情况而言，光照仍是影响视觉效果不可或缺的一部分。

在 Babylon 中，Light 光照是场景中的一种基础对象，用于向材质计算提供光照信息。它本身不会直接改变 Mesh 的几何结构，而是在渲染过程中影响物体材质Material的表现。

通常一个完整的三维渲染结果通常由多个因素共同决定：

最终画面
=
Mesh（几何结构） //描述物体的形状和空间结构；
+
Material（材质属性） //描述物体表面的颜色、粗糙度、金属度等；
+
Light（光照信息） //提供光照方向、光源颜色、光照强度等
+
Camera（观察角度） //决定最终观察的位置和角度等

因此，Light 并不是简单地增加场景亮度，而是参与三维场景中光线计算的重要组成部分。

不同类型的 Light与不同的光照配置，以及不同的材质，会直接影响最终渲染效果。

2. Light的作用

一个光源通常包含多个基本属性，例如位置、方向、颜色以及强度等，这些属性共同决定了光线如何作用于场景中的物体。

光源位置Position，确定光源产生的位置，但不同类型的Light对位置的依赖程度不同，例如PointLight、SpotLight具有明确的位置概念。

光源方向Direction，表示光线传播方向，DirectionalLight就是通过方向来模拟太阳光的平行光效果。

光源颜色Color，决定光线本身的颜色，它会参与颜色计算但不代表最终颜色，例如蓝色环境光会让整个场景产生冷色调。

光源强度Intensity，表示光照能量的大小，会影响场景的明暗程度，但不是绝对的，需要合理的材质参数、后处理效果等配合最终效果呈现。

Light
|
| 位置
| 方向
| 颜色
| 强度
↓
光照计算
↓
Normal + Material
↓
Mesh最终表现

物体本身材质也会直接影响光照效果，例如材质的金属感、粗糙度、透明度，以及材质自身的漫反射、高光等。

物体的法线Normal是很重要的概念，简单来说它表示物体表面某个点朝向的方向。

在进行光照计算时，需要比较光线方向、物体法线方向，当它们接近一致时说明光线正面照射物体，该区域会更亮。

反之，当光线方向与法线夹角较大时，受到的光照会减弱。

3. 小结

Part 2 Light基类与子类

1. Light抽象基类

在 Babylon 中，所有光源类型都继承自 Light 抽象基类。

Light基类定义了所有光源共有的基础能力，例如是否启用、光源颜色、光照强度等。

Light不能直接被实例化，它本身只是所有光源的抽象定义，实际使用需要创建它的子类。

const light = new BABYLON.Light(
   name: string, //必填项
   scene?: Sene //非必填
);

2. ShadowLight抽象类

ShadowLight 是 Babylon 中支持阴影计算的抽象类，它继承自Light基类。

它在Light基础上增加了光源方向、阴影投射能力与相关计算能力。

ShadowLight不能直接实例化，它主要承担阴影光源的公共能力抽象，实际使用需要创建它的子类。

3. HemisphericLight类

HemisphericLight是Babylon中一种特殊的光源类型，用于模拟环境光效果，它继承自Light基类。

与其他光源不同，它模拟现实环境中来自天空和地面的散射光，它不继承ShadowLight。

const light = new BABYLON.HemisphericLight(
   name: string, //必填项
   direction: Vector3, //必填项，光照方向
   scene?: Scene //非必填
);

• HemisphericLight没有产生阴影的能力，更适合作为场景基础补光；

• HemisphericLight可以通过 diffuse 设置天空方向光颜色，通过 groundColor 设置地面反射光颜色；

• direction 用于控制上下两个半球光照方向，通常设置为 (0,1,0) 表示来自天空方向的环境光。

4. DirectionalLight类

DirectionalLight是Babylon最常用的光源之一，用于模拟类似太阳光的平行光，它继承自ShadowLight类。

它光照效果主要由光线方向决定，而不是由光源位置决定，简单地说，我们只需要定义光线传播方向，而无需关心光源位置。

const light = new BABYLON.DirectionalLight(
   name: string, //必填项
   direction: Vector3, //必填项，光照方向
   scene?: Scene //非必填
);

• DirectionalLight不存在距离衰减，理论上它可以照亮整个Scene，适用于大范围场景以及室外环境；

• DirectionalLight的Position主要对阴影计算产生影响，不会影响其光照范围；

5. PointLight类

PointLight用于模拟点光源，例如灯泡、蜡烛等，它继承自ShadowLight类。

PointLight 的光线从一个固定空间位置向四周发散，因此光照效果主要受到光源位置和距离影响。

const light = new BABYLON.PointLight(
   name: string,        // 必填项
   position: Vector3,   // 必填项，光源位置
   scene?: Scene        // 非必填
);

• PointLight会随着距离增加产生光照衰减，适用于室内灯光等局部照明场景；

6. SpotLight类

SpotLight是用于模拟聚光灯效果的光源类型，例如手电筒、舞台灯等，它继承自ShadowLight类。

它同时具备位置和方向两个属性，通过限制光照范围形成锥形照射区域。

const light = new BABYLON.SpotLight(
   name: string, // 必填项
   position: Vector3, // 必填项，光源位置
   direction: Vector3, // 必填项，光照方向
   angle: number, //必填项，聚光范围
   exponent: number, //必填项，光照集中程度
   scene?: Scene // 非必填
);

7. AreaLight抽象类

AreaLight 是 Babylon 中用于表示区域光源的抽象类，它继承自Light基类。

它在Light基础上定义了区域光源共有的基础能力。

AreaLight不能直接实例化，它主要承担区域光源的公共能力抽象，实际使用需要创建它的子类。

8. RectAreaLight类

RectAreaLight是 Babylon 中用于模拟矩形区域光源的光源类型，它继承自 AreaLight类。

与点光源不同，RectAreaLight的发光源是一个具有宽度和高度的矩形区域。

const light = new BABYLON.RectAreaLight(
   name: string,        // 必填项
   position: Vector3,   // 必填项，光源位置
   width: number,       // 必填项，光源宽度
   height: number,      // 必填项，光源高度
   scene?: Scene        // 非必填
);

• RectAreaLight 通过 width 和 height 控制光源区域大小，更适合模拟真实室内照明效果；

9. 小结

抽象类（不能直接实例化）：

子类：

Part 3 Light实例成员

1. Light基类成员

name、id、uniqueId、parent、metadata等来自于Node类，这里不再汇总。

2. ShadowLight类成员

ShadowLight继承自Light基类，所以它拥有Light基类的所有成员。

3. HemisphericLight类成员

HemisphericLight继承自Light基类，所以它拥有Light基类的所有成员。

4. DirectionalLight类成员

DirectionalLight继承自ShadowLight类，所以它拥有ShadowLight类的所有成员。

5. PointLight类成员

PointLight继承自ShadowLight类，所以它拥有ShadowLight类的所有成员。

6. SpotLight类成员

SpotLight继承自ShadowLight类，所以它拥有ShadowLight类的所有成员。

7. AreaLight类成员

AreaLight继承自Light基类，所以它拥有Light基类的所有成员。

8. RectAreaLight类成员

RectAreaLight继承自AreaLight类，所以它拥有RectAreaLight类的所有成员。

Part 4 Shadow系统

1. Shadow概述

阴影Shadow用于模拟光线被物体遮挡后产生的暗部区域。

在Babylon中Shadow 并不是由Light单独完成的，而是通过Light、ShadowGenerator 以及ShadowMap共同实现。

支持阴影的光源均继承自ShadowLight抽象类：

Light
|
+– ShadowLight
      |
      +– DirectionalLight
      +– PointLight
      +– SpotLight

2. ShadowGenerator类

阴影生成器ShadowGenerator是 Babylon 中负责管理阴影的核心对象，它不负责光源，而是生成阴影的管理器。

ShadowGenerator通过绑定支持Shadow的Light对象，根据Light的光源位置Position、光源方向Direction、光照范围Range等信息，判断哪些位置该生成阴影。

同时，ShadowGenerator还负责管理哪些Mesh可以产生阴影并配置阴影效果，生成深度纹理ShadowMap，将数据传递给接收阴影的物体，使其参与最终颜色效果的计算。

new ShadowGenerator(
mapSize: number, //必填项，阴影贴图的分辨率
   light: IShadowLight, //必填项，用于生成阴影的光源对象
   usefullFloatFirst?: boolean, //可选，是否优先使用完整浮点纹理存储 ShadowMap 数，可提高阴影深度精度
   camera?: Nullable<Camera>, //可选，指定使用的 Camera
   useRedTextureType?: boolean, //可选，是否使用单通道红色纹理格式存储 ShadowMap 数据，控制ShadowMap 的纹理格式
   forceGLSL?: boolean //可选，是否强制使用 GLSL Shader，主要用于兼容性控制
)

ShadowGenerator的阴影管理，主要对阴影产生物体ShadowCaster进行管理，它表示能够遮挡光线并产生阴影的 Mesh。

Mesh需开启receiveShadows能力使自身成为阴影接收物体ShadowReceiver。

阴影效果的呈现以上两者缺一不可，如果没有产生阴影的物体，即时配置接收阴影的物体也没有效果；如果没有接收阴影的物体，即时全部物体可以产生阴影也不会有效果。

3. ShadowGenerator类成员

ICustomShaderOptions的配置内容包括：

4. 从三维世界到屏幕的过程

在Camera篇中讲到，一个物体最终呈现在屏幕的位置，由物体的世界坐标通过视图矩阵Camera View Matrix再到投影矩阵Camera Projection Matrix转换而来。

简单的说，一个物体最终在屏幕中的位置，由Camera的矩阵变换决定。

那么物体最终在屏幕上的呈现效果呢？

物体最终的视觉效果由Light光照计算、Material材质计算、Shadow阴影计算、PostProcess后处理效果共同决定，其中：

• Light 决定物体受到的光照强弱以及明暗关系；

• Material 决定物体表面的颜色、金属度、粗糙度、纹理等材质表现；

• Shadow 根据光源遮挡关系计算阴影区域，对光照结果进行衰减；

• PostProcess 对最终渲染结果进行屏幕后处理；

这里我们不对Material材质计算与PostProcess后处理效果进行深入说明，后续单独篇章中会讲到。

Light 光照计算通过光源参数与物体表面法线的关系，计算物体表面受到的光照贡献，从而决定物体的明暗和光照效果。

光照计算是计算光源颜色、光照强度以及物体法线与光照方向的过程，它决定的是物体表面的明暗效果。

简单来讲，它只负责描述物体表面哪部分更亮，哪部分更暗。

Shadow阴影计算则稍微复杂，在较大的场景中也会带来明显的性能开销。

首先ShadowGenerator基于它所绑定的Light，通过光源视图矩阵Light View Matrix和光源投影矩阵Light Projection Matrix建立光源空间。

光源视图矩阵Light View Matrix负责将世界空间中的物体转换到 Light 的观察空间。

光源投影矩阵Light Projection Matrix将光源观察空间中的坐标转换到 ShadowMap 使用的二维空间。

建立光源空间后ShadowGenerator会生成对应的ShadowMap，它本质上是一张特殊的深度纹理，不保存颜色信息，而是从光源角度记录每个位置距离光源的关系。

Shader计算时，会根据ShadowMap的深度信息，对Light光照计算结果进行衰减，综合Material材质计算与PostProcess后处理效果计算最终的呈现效果。

Part 5 Light常用功能

1. HemisphericLight场景基础补光

HemisphericLight不依赖光源位置，通常作为作为场景环境补光。

常用配置项包括：

• HemisphericLight无法产生阴影，不能作为ShadowGenerator的阴影光源；

• intensity通常作为基础环境光，不建议设置过强；

2. DirectionalLight场景主光源

DirectionalLight光线方向固定且不会随着距离产生衰减，通常作为场景中的主光源。

常用配置项包括：

• DirectionalLight支持ShadowGenerator生成阴影，是三维场景中最常用的阴影光源类型；

• intensity避免过高导致场景过曝，实际使用中建议配合HemisphericLight进行调整；

3. ShadowGenerator生成阴影

ShadowGenerator用于根据光源与场景物体之间的遮挡关系生成阴影效果，在较大场景中一般是主要的性能瓶颈之一。

常用配置包括：

• 要开启阴影效果，首先依赖于支持阴影的光照Light及其合理配置，HemisphericLight与RectAreaLight不支持阴影；

• 生成阴影首先要创建ShadowGenerator实例，并通过addShadowCaster设置产生阴影的Mesh；

• 需要有开启了receiveShadows的Mesh作为阴影接收者，才能看见阴影效果；

  总之，要实现阴影效果，ShadowLight光照、ShadowCaster阴影生成者、ShadowReceiver阴影接收者三者的配置缺一不可；

• mapSize过高会增加GPU压力，在大型三维场景中需要平衡性能与效果；

• 开启阴影会增加额外渲染开销，需要避免将大量Mesh加入ShadowCaster中；

Part 6 踩坑记录

1. 阴影配置不生效

• 首先检查是否正确创建支持阴影的光源，且是否在正确的Scene中；

• 检查全局配置scene.lightsEnabled与scene.shadowsEnabled是否为开启状态；

• 检查是否在对应的Scene场景中创建ShadowGenerator，并添加addShadowCaster列表是否正确添加Mesh或是否为空；

• 检查是否对需要接收阴影的Mesh配置了receiveShadows = true；

• 检查光照的方向、强度是否合理，避免光照未覆盖目标区域导致无法观察阴影；

• 检查接收阴影的Mesh是否在阴影投射范围；

2. 阴影边缘出现条纹、闪烁或黑色噪点

• 首先确认问题是否由 ShadowGenerator 引起，可以临时关闭阴影进行对比；

• 检查 ShadowGenerator.bias 是否过小，导致模型自身深度比较产生误判；

• 检查 normalBias 是否需要调整，尤其是建筑、地面等大面积倾斜模型；

• 检查 ShadowMap 的mapSize分辨率是否过低，低分辨率可能导致阴影精度不足：

3. Light与Shadow性能调优

• 首先场景中的Light数量不宜过多，尤其避免大量PointLight、SpotLight参与实时光照计算；

• 检查ShadowGenerator的mapSize是否合理，过大的ShadowMap会增加GPU显存占用和渲染压力；

• 检查ShadowGenerator中添加的ShadowCaster数量是否过多，避免将所有Mesh加入阴影计算；

• 检查ShadowGenerator的阴影过滤方式，例如usePercentageCloserFiltering、useContactHardeningShadow等，高质量过滤会增加额外计算成本；

• 检查ShadowGenerator的bias、normalBias设置，避免为了修复阴影痤疮问题过度增加偏移导致阴影质量下降；

• 检查ShadowGenerator的filter类型选择，根据场景需求选择PCF、PCF Soft、ESM等阴影算法；

• 检查阴影范围是否合理，避免Shadow Camera覆盖过大的无效区域导致阴影精度下降；

• 检查是否存在大量透明模型参与阴影计算，避免产生额外Shadow Pass开销；

总结

Light 是 Babylon 中负责模拟真实世界光照效果的核心模块，它决定了场景中物体如何受到光线影响，是连接三维空间、材质表现以及最终视觉效果的重要组成部分。虽然Light本身的API结构相对简单，但其背后涉及光照计算、法线、材质响应、阴影生成以及GPU渲染流程等多个三维核心概念，在实际项目中也是最容易影响场景表现和性能的模块之一。

本文主要整理了 Light 的基础概念、不同类型光源、光照计算流程、常用配置、ShadowGenerator 阴影机制以及实际开发过程中遇到的常见问题与性能调优方案。希望通过 API 梳理与项目实践结合的方式，帮助开发者不仅了解不同光源的使用方式，也能够理解 Light 与 Shadow 在最终渲染效果中的作用关系，以及遇到光照异常时的排查思路。

在实际三维项目中，Light 并不是简单的“增加亮度”，而是需要根据场景规模、模型数量以及展示需求合理组合使用。通常通过环境补光、主光源以及必要的阴影效果共同构建场景光照，同时结合性能优化避免过多光源和阴影计算带来的额外开销。

后续会继续整理 Babylon.js 8.x 其他核心模块。