在一個場景中, 光源是十分重要的, 無論是在生活中還是在程式中, 有了光, 才能看到物體, 本文首先使用半球光引用的效果, 光源直接放置于場景之上,光照顔色從天空光線顔色顔色漸變到地面光線顔色, 而後...

目錄
Three.Light
燈光
1. Light
2. AmbientLight
3. DirectionalLight
4. HemisphereLight
5. PointLight
power : Float
6. RectAreaLight
7. SpotLight
輔助對象
1. DirectionalLightHelper
2. HemisphereLightHelper
3. PointLightHelper
4. RectAreaLightHelper
5. SpotLightHelper
陰影1. DirectionalLightShadow
首先展示的是使用半球光引用的效果, 光源直接放置于場景之上,光照顔色從天空光線顔色顔色漸變到地面光線顔色。光照主要有
AmbientLight 環境光 DirectionalLight 平行光 HemisphereLight 半球光 PointLight 點光源 RectAreaLight 平面光光源 SpotLight 聚光燈
由于three.js可視化還是不夠完善, 是以有了衆多光源的輔助對象, 每一種燈光都有自己的特性以及共性, 大量的燈光可以産生陰影, 後面一一介紹
Light有很多相關内容, 首先先看下衆多燈光的效果
光源的基類 - 所有其他的光類型都繼承了該類描述的屬性和方法
Light屬性
color : Color
光源的顔色。
如果構造的時候沒有傳遞,預設會建立一個新的 Color 并設定為白色。
intensity : Float
光照的強度,或者說能量。
在 physically correct 模式下, color 和強度 的乘積被解析為以坎德拉(candela)為機關的發光強度。 預設值 - 1.0
方法
copy ( source : Light ) : Light
從source複制 color, intensity 的值到目前光源對象中。
環境光會均勻的照亮場景中的所有物體
注意: 環境光不能用來投射陰影,因為它沒有方向
構造函數
AmbientLight( color : Integer, intensity : Float )
color - (參數可選)顔色的rgb數值。預設值為 0xffffff。
intensity - (參數可選)光照的強度。預設值為 1。
屬性
castShadow : 這個參數在對象構造的時候就被設定成了 undefined 。因為環境光不能投射陰影。
方法與Light相同
示例
無環境光樣式
有環境光樣式
有了環境光, 那麼到處都會有光, 簡單比喻, 白天, 在家裡一個房間, 沒開燈, 太陽光通過地闆等物質反射光到房間, 那麼房間也是亮的, 這就是環境光
平行光是沿着特定方向發射的光。這種光的表現像是無限遠,從它發出的光線都是平行的。常常用平行光來模拟太陽光 的效果; 太陽足夠遠,是以我們可以認為太陽的位置是無限遠,是以我們認為從太陽發出的光線也都是平行的。
注意 : 平行光設定旋轉沒有效果, 它的方向是從一個平行光的位置 position 到 target的位置。 (而不是一個隻有旋轉分量的'自由平行光')。
需要注意的屬性
position : Vector3
假如這個值設定等于 Object3D.DefaultUp (0, 1, 0),那麼光線将會從上往下照射。
target : Object3D
平行光的方向是從它的位置到目标位置。預設的目标位置為原點 (0,0,0)。
注意: 對于目标的位置,要将其更改為除預設值之外的任何位置,它必須被添加到 scene 場景中去。
光源直接放置于場景之上,光照顔色從天空光線顔色顔色漸變到地面光線顔色
注意 : 半球光不能投射陰影
HemisphereLight( skyColor : Integer, groundColor : Integer, intensity : Float )
skyColor - (可選參數) 天空中發出光線的顔色。 預設值 0xffffff。
groundColor - (可選參數) 地面發出光線的顔色。 預設值 0xffffff。
intensity - (可選參數) 光照強度。 預設值 1。
屬性中需要注意的
color : Float
在構造時傳遞的天空發出光線的顔色。 預設會建立 Color 并設定為白色(0xffffff)。
groundColor : Float
在構造時傳遞的地面發出光線的顔色。 預設會建立 Color 并設定為白色(0xffffff)。
效果
帶有HemisphereLight, 天空發出紅色光
物體本來的顔色在AmbientLight有說明, 棕色光, 兩種相乘, 得到上述顔色
從一個點向各個方向發射的光源。一個常見的例子是模拟一個燈泡發出的光
PointLight( color : Integer, intensity : Float, distance : Number, decay : Float )
color - (可選參數)) 十六進制光照顔色。 預設值 0xffffff (白色)
intensity - (可選參數) 光照強度。 預設值 1
distance - 這個距離表示從光源到光照強度為0的位置。 當設定為0時,光永遠不會消失(距離無窮大)。預設值 0.
decay - 沿着光照距離的衰退量。預設值 1。 在 physically correct 模式中,decay = 2。
decay : Float
沿着光照距離的衰減量
在 physically correct 模式下,decay 設定為等于2将實作現實世界的光衰減。
預設值為 1
distance : Float
如果非零,那麼光強度将會從最大值目前燈光位置處按照距離線性衰減到0。 預設值為 0.0
光功率
在 physically correct 模式中, 表示以"流明(光通量機關)"為機關的光功率。 預設值 - 4Math.PI
平面光光源從一個矩形平面上均勻地發射光線。這種光源可以用來模拟像明亮的窗戶或者條狀燈光光源
注意:
不支援陰影。
隻支援 MeshStandardMaterial 和 MeshPhysicalMaterial 兩種材質。
你必須在你的場景中加入 不支援陰影。
你必須在你的場景中加入 RectAreaLightUniformsLib 。
RectAreaLight( color : Integer, intensity : Float, width : Float, height : Float )
color - (可選參數) 十六進制數字表示的光照顔色。預設值為 0xffffff (白色)
intensity - (可選參數) 光源強度/亮度 。預設值為 1。
width - (可選參數) 光源寬度。預設值為 10。
height - (可選參數) 光源高度。預設值為 10。
聚光燈是從一個方向上的一個點發出,沿着一個圓錐體,它離光越遠,它的尺寸就越大
構造器
SpotLight( color : Integer, intensity : Float, distance : Float, angle : Radians, penumbra : Float, decay : Float )
color - (可選參數) 十六進制光照顔色。 預設值 0xffffff (白色)。
distance - 從光源發出光的最大距離,其強度根據光源的距離線性衰減。
angle - 光線散射角度,最大為Math.PI/2。
penumbra - 聚光錐的半影衰減百分比。在0和1之間的值。預設為0。
decay - 沿着光照距離的衰減量。
penumbra : Float
聚光錐的半影衰減百分比。在0和1之間的值。 預設值 — 0.0
光功率: 在 physically correct 模式中, 表示以"流明(光通量機關)"為機關的光功率。 預設值 - 4Math.P
平行光的方向是從它的位置到目标位置.預設的目标位置為原點 (0,0,0)。
注意: 對于目标的位置,要将其更改為除預設值之外的任何位置,它必須被添加到 scene 場景中去
用于模拟場景中平行光 DirectionalLight 的輔助對象. 其中包含了表示光位置的平面和表示光方向的線段.
DirectionalLightHelper( light : DirectionalLight, size : Number, color : Hex )
light-- 被模拟的光源.
size -- (可選的) 平面的尺寸. 預設為 1.
color -- (可選的) 如果沒有設定顔色将使用光源的顔色.
lightPlane : Line
包含表示平行光方向的線網格
light : DirectionalLight
被模拟的光源.
color : hex
構造函數中傳入的顔色值. 預設為 undefined. 如果改變該值, 輔助對象的顔色将在下一次 update 被調用時更新
需要注意的方法
dispose () : null
銷毀該平行光輔助對象.
update () : null
更新輔助對象,與模拟的 directionalLight 光源的位置和方向保持一緻
建立一個虛拟的球形網格 Mesh 的輔助對象來模拟 半球形光源 HemisphereLight
HemisphereLightHelper( light : HemisphereLight, sphereSize : Number, color : Hex )
light -- 被模拟的光源.
size -- 用于模拟光源的網格尺寸.
color -- (可選的) 如果沒有指派輔助對象将使用光源的顔色.
其他屬性和方法類似
天空射下來的是紅光, 地面射上去的是黑光
建立一個虛拟的球形網格 Mesh 的輔助對象來模拟 點光源 PointLight.
PointLightHelper( light : PointLight, sphereSize : Float, color : Hex )
light -- 要模拟的光源.
sphereSize -- (可選的) 球形輔助對象的尺寸. 預設為 1.
其他屬性方法類似
建立一個表示 RectAreaLight 的輔助對象.
RectAreaLightHelper( light : RectAreaLight, color : Hex )
color -- (可選) 如果沒有指派輔助對象将使用光源的顔色.
用于模拟聚光燈 SpotLight 的錐形輔助對象.
SpotLightHelper( light : SpotLight, color : Hex )
light -- 被模拟的聚光燈 SpotLight .
這是用于在DirectionalLights内部計算陰影
注意: 與其他陰影類不同,它是使用OrthographicCamera來計算陰影,而不是PerspectiveCamera。這是因為來自DirectionalLight的光線是平行的
具體代碼見 https://gitee.com/xiaxiangx/threejs_study/tree/master/4_%E5%85%89%E6%BA%90
希望讀者在看完後能提出意見, 點個贊, 鼓勵一下, 我們一起進步. 加油 !!