首页 / three.js / 使用示例
聚光灯
一盏灯从高处照向地形,锥角决定光斑大小,半影决定边缘软硬。 灯头会缓慢绕圈,光斑跟着在坡面上滑动,阴影也随之变形。
源码与运行效果
angle 是半锥角
angle 的单位是弧度,指光锥边缘与中心轴的夹角,
因此整个光锥的张开角是它的两倍。滑杆给的是度数,传入前用
degToRad 换算。
penumbra 取值范围 0 到 1,表示边缘衰减区占整个锥面的比例。
0 是完全硬边,光斑边界像刀切;1 时从中心就开始衰减,几乎没有边界。
舞台效果常用 0.3 到 0.5。
| 参数 | 取值 | 作用 |
|---|---|---|
angle | 6° – 55° | 光斑张角 |
penumbra | 0 – 1 | 边缘柔和度 |
decay | 1.6 | 略缓于平方反比 |
distance | 60 | 超出即不再照亮 |
目标点必须是场景里的对象
聚光灯靠 spot.target 确定朝向。这个目标本身也是一个
Object3D,必须加进场景,否则它的世界矩阵不会更新,
灯会一直朝着默认的原点照。
示例每帧改目标的坐标再调用 updateMatrixWorld(),
灯头就跟着摆动。这比旋转灯体本身更直观:位置不动,只改「看向哪里」。
阴影贴图会随锥角变模糊。锥角越大,同样的贴图分辨率要覆盖更大范围,
边缘锯齿越明显。调大角度时记得同步提高
shadow.mapSize,或者接受更软的阴影。