ThreeJS教程：聚光源SpotLight
推荐：将NSDT场景编辑器加入你的3D工具链
3D工具集：NSDT简石数字孪生
聚光源SpotLight
入门部分给大家介绍过平行光DirectionalLight、点光源PointLight、环境光AmbientLight,下面给大家介绍一个新的光源对象，也就是聚广源SpotLight。
- 1.8. 光源对物体表面影响(opens new window)
- 1.10. 平行光与环境光(opens new window)
创建聚广源SpotLight
聚光源可以认为是一个沿着特定方会逐渐发散的光源，照射范围在三维空间中构成一个圆锥体。
// 聚光源
// 0xffffff:光源颜色
// 1.0：光照强度intensity
const spotLight = new THREE.SpotLight(0xffffff,1.0);
scene.add(spotLight);//光源添加到场景中
光照强度也可以不通过THREE.SpotLight参数2设置，直接通过光照强度属性.intensity设置。
spotLight.intensity = 1.0;//光照强度
聚光源发散角度.angle
通过属性.angle可以设置聚光源发散角度，和目标.target两个属性来实现。
// 设置聚光光源发散角度
spotLight.angle = Math.PI / 6;//光锥角度的二分之一
聚光源位置.position
聚光源SpotLight的父类是Light，Light的父类是Object3D，聚光源SpotLight会继承父类Object3D的位置属性.position。
// 设置聚光光源位置
spotLight.position.set(0, 50, 0);
聚广源目标对象.target
聚广源目标对象.target和光源的位置.position共同确定聚广源照射方向。
浏览器控制台打印聚广源目标对象.target属性，可以看到属性值是一个模型对象Object3D。
console.log('聚广源指向目标',spotLight.target);
聚广源目标对象属性的位置通过属性值Object3D的.position属性设置。
// spotLight.target是一个模型对象Object3D，默认在坐标原点
spotLight.target.position.set(50,0,0);
//spotLight.target添加到场景中.target.position才会起作用
scene.add(spotLight.target);
聚光源辅助对象SpotLightHelper
// 聚广源辅助对象，可视化聚广源
const spotLightHelper = new THREE.SpotLightHelper(spotLight,0xffffff)
scene.add(spotLightHelper);