Three.js中有很多各式各樣的光源,不同的光源可以產生不同的光照效果。這篇文章主要介紹他們的區別,以及各自的應用場景。
目錄:
- AmbientLight (環境光)
- PointLight (點光源)
- SpotLight (聚光燈光源)
- DirectionalLight (平行光)
- HemisphereLight (半球光)
- AreaLight (面光源)
- LensFlare (鏡頭眩光)
這不是一種光源,但是通過LensFlare 可以為場景中的光源添加眩光效果。
1.AmbientLight
基礎光源,顏色會添加到整個場景和所有對象的當前顏色上。不能作為場景中的唯一光源。一般作為輔助使用,目的是弱化陰影或者添加一些顏色。
2.PointLight
空間中的一點,朝所有的方向發射光線。就像夜空中的照明彈。點光源不產生陰影。
點光源的屬性:
color:顏色
intensity: 光照強度,默認為1
distance:距離。決定光線可以照射多遠。光線的亮度不會隨著距離的增加而遞減。
position:位置
visible:是否可見。true,光源打開,false,光源關閉
3.SpotLight
聚光的錐形效果,類似臺燈、天花板的吊燈或者手電筒。可以產生陰影。
4.DirectinalLight
也叫無限光。這種光源發出的光線是平行的,例如太陽光。
場景中對象接收到的都是相同光強的光。這種光只用direction,color,intensity屬性計算顏色和陰影。
與聚光燈光源一樣,也可以設置幾個屬性來控制光照強度和投影的方法,屬性基本相同。如position,target,intensity,distance,castShadow,onlyShadow,shadowCameraNear.....
5.特殊光源
HemisphereLight 半球光光源
用以創建更貼近自然的光照效果。例如室外環境,并不是所有的光照都來自上方,很多來自空氣散射,地面散射等等。這種光源就是為了這種情形創建的。
var hemiLight = new THREE.HemisphereLight(0x0000ff, 0x00ff00 , 0.6)
hemiLight.position.set(0,500,0);
scene.add(hemiLight);
groundColor:從地面發出的光的顏色。
Color:從天空發出的光的顏色。
intensity:光線照射強度。
AreaLight 平面光光源
即光源為矩形。AreaLight不在Three.js標準庫中。因此需要額外引用文件。并且應該使用WebGL延遲渲染器(WebGLDeferredRenderer對象),而不是WebGLRenderer。
LensFlare 鏡頭眩光
通過實例化THREE.LensFlare對象來創建鏡頭眩光效果。