一、前言

这一篇文章我们主要来了解一下 ThreeJs 中关于光和影的相关知识点。通过给 3D 场景以及物体加上光照和阴影的效果使其能更真实的模拟现实从而也能使整个效果看起来更加的具有质感。

二、概述

ThreeJs 中给我们提供了多种光源下面请看类图以及相应的概述。

光的基类是 Light其是继承自 Object3D 的。它作为一个对象被添加进了 Scene 中从而进行渲染的。影的基类是 LightShadow它是作为光的内部类供光照在内部进行阴影计算的我们不能直接构造它。如图并不是所有的光照都会产生阴影是否会产生阴影与光照所具备的特性有关。

三、认识光和影

下面我们来全面的认识一下 Three Js 中的光照和阴影对它们的相关特性以及使用的场景来做一个归纳。

3.1 Light

3.2 AmbientLight

3.3 DirectionalLight

3.4 HemisphereLight

3.5 PointLight

3.6 RectAreaLight

3.7 SpotLight

四、总结

最后简单来总结一下