9.Three.js的光源
9.Three.js的光源
1、 光源基类
在Threejs中，需要有光源，才能看得见物体，否则，我们看到的物体是黑暗的。同时，光源配合材质的反射效果，能更加展示3D场景。光源用Light表示，它是所有光源的基类。它的构造函数是：
THREE.Light ( hex )
它有一个参数hex，接受一个16进制的颜色值。例如要定义一种红色的光源，我们可以这样来定义：
let redLight = new THREE.Light(0xFF0000);
2、 由基类派生出来的其他种类光源
THREE.Light是所有光源的基类，事实上，为了模拟现实的各种类型的光源，需要设计很多不同种类的光源对象。主要有：
环境光（AmbientLight）、聚光灯（SpotLight）、点光源（PointLight）、AreaLight（区域光）、DirectionalLight（方向光）
2.1环境光
环境光是经过多次反射而来的光称为环境光，无法确定其最初的方向。环境光是一种无处不在的光。环境光源放出的光线被认为来自任何方向。因此，当你仅为场景指定环境光时，所有的物体无论法向量如何，都将表现为同样的明暗程度。 （这是因为，反射光可以从各个方向进入您的眼睛）
环境光用THREE.AmbientLight来表示，它的构造函数如下所示：
THREE.AmbientLight( color, intensity );
第一个参数为光照颜色，第二个参数为光照强度。
可以如下添加一个环境光到场景中：
var light = new THREE.AmbientLight( 0xff0000 , 1);
scene.add( light );
2.2 点光源
点光源：由这种光源放出的光线来自同一点，且方向辐射自四面八方。例如蜡烛放出的光，萤火虫放出的光。
点光源用PointLight来表示，它的构造函数如下所示：
PointLight( color, intensity, distance, decay )
这个类的参数稍微复杂一些，我们花点时间来解释一下：
Color：光的颜色
Intensity：光的强度，默认是1.0,就是说是100%强度的灯光，
distance：光的距离，从光源所在的位置，经过distance这段距离之后，光的强度将从Intensity衰减为0。 默认情况下，这个值为0.0，表示光源强度不衰减。
decay: 沿着光照距离的衰退量。默认值为 2
2.3 聚光灯
聚光灯：这种光源的光线从一个锥体中射出，在被照射的物体上产生聚光的效果。使用这种光源需要指定光的射出方向以及锥体的顶角α。聚光灯示例如图所示：
聚光灯的构造函数是：
THREE.SpotLight( hex, intensity, distance, angle, exponent )
函数的参数如下所示：
Hex：聚光灯发出的颜色，如0xFFFFFF
Intensity：光源的强度，默认是1.0，如果为0.5，则强度是一半，意思是颜色会淡一些。和上面点光源一样。
Distance：光线的强度，从最大值衰减到0，需要的距离。 默认为0，表示光不衰减，如果非0，则表示从光源的位置到Distance的距离，光都在线性衰减。到离光源距离Distance时，光源强度为0.
Angle：聚光灯着色的角度，用弧度作为单位，这个角度是和光源的方向形成的角度。
exponent：光源模型中，衰减的一个参数，越大衰减约快。
3.光源与材质的关系
材质与光源有什么关系，这是一个容易傻傻分不清的问题。在没有深入讲解前，我们只能说它们是相互联系，相互依托的关系。
材质就是物体的质地。我们可以用撤分文字的方法来理解。材质就是材料和质感的完美结合。
在渲染程序中，它是表面各可视属性的结合，这些可视属性是指表面的色彩、纹理、光滑度、透明度、反射率、折射率、发光度等。正是有了这些属性，才能让我们识别三维中的模型是什么做成的，也正是有了这些属性，我们计算机三维的虚拟世界才会和真实世界一样缤纷多彩。
比如，下面是一种兰伯特材质，材质中的一种：
var material = new THREE.MeshLambertMaterial( { color:0x000000} );
我们可以尝试通过修改材质的颜色，光照的颜色，我们会看到不一样的效果
视频演示地址：https://www.bilibili.com/video/BV1qd1YYCE2f/?vd_source=0f4eae2845bd3b24b877e4586ffda69a