webgl之五彩光源

在three.js中，光源有乙個基類three.light(hex)，這個hex接受16進製制顏色作為引數而初始化光源的顏色，比如我們要定義一種綠色的光源，可以這樣來定義：

即除了這個基類光源之外，我們還有環境光、區域光、方向光、聚光燈、點光源等等。下面我們介紹一些常用的光源。

環境光是經過多次反射而來的光，所以無法確定其最初的方向。它是一種無處不在的光，其光源可以認為是來自任何方向。所以，當我們制定場景光源為環境光時，所有的物體都會表現出同樣的明暗程度，環境光可以用 three.ambientlight 來表示，他的建構函式即為 three.ambientlight(hex); ，它仍然接受16進製制顏色作為引數，如下：

var light = new three.ambientlight(0xff00000
);scene.add(light);

如上，加入光源之後，場景就能夠通過光源渲染出效果了。

由這種光源放出的光線是來自同一點的，且方向是輻射到四面八方的。比如家裡燈泡就是乙個點光源。建構函式如下：

var light = new three.pointlight(color, intensity, distance);

color，即光的顏色。

intensity，即光的強度，取值在0到1之間，預設是1.0，即強度最高。

distance，即光的距離，從光源所在的位置，經過distance轉舉例之後，光的強度將從intensity衰減為0. 預設情況下這個值為0.0，表示光源強度不衰減。

這種光源的光線從乙個椎體中射出，在被照射的物體上產生聚光的效果，使用這種光源需要指定光的射出方向以及椎體的頂角α，如下：

我們可以使用如下建構函式：

var light = nwe three.spotlight(hex, intensity, distance, angle, exponent);

平行光又稱為方向光（directional light），是一組沒有衰減的平行額光線，類似太陽光的效果，

建構函式如下所示：

var lignt = new three.directionallight(hex, intensity);

其中，hex就是光的顏色，而intensity就是光的千古。

我們在螢幕上畫乙個物體，不帶任何的光源，定義物體的顏色為黑色，其值為0x000000，定義材質如下：

var material = new three.meshlambertmaterial(  ); //
這是蘭伯特材質，材質中的一種

那麼最終的效果就是什麼也看不到。並且實際上我們可以得到從這裡並不那麼容易可以得到的結論：

如果在沒有任何光源的情況下，最終的顏色都將是黑色，無論材質是什麼顏色。所以說在白天時，我們看到的物體的顏色實際上是物體沒能吸收的顏色，我們才看到了，而黑夜情況下，物體什麼都吸收不了，自然我們什麼也就看不到了。

而接下來我們要說的是lambert（蘭伯特）材質，這是在灰暗的或者不光滑的表面產生均勻散射而形成的材質型別。比如一張紙就是lambert表面，它粗糙、均勻。它會在所有的反向上均勻地散射燈光，所以lambert材質會受到環境光的影響，呈現環境光的顏色，與材質本身顏色關係不大。

而環境光就是在場景中無處不在的光，它對物體的影響是均勻的，也就是說無論你從物體的哪個角度觀察，物體的顏色都是一樣的，這就是環境光了。

webgl之五彩光源

WebGL7 五彩的光源（2）

python繪製五彩蟒蛇

五彩繽紛的卡片

webgl之五彩光源

WebGL7 五彩的光源（2）

python繪製五彩蟒蛇

五彩繽紛的卡片

相關推薦