Three.js開發(fā)指南
首部全面講解Three.js開發(fā)的實(shí)用指南，循序漸進(jìn)講解Three.js的各種功能，通過大量交互示例，深入探索使用開源的Three.js庫創(chuàng)建絢麗三維圖形的實(shí)用方法和技巧。
在過去的兩年里，瀏覽器變得更加強(qiáng)大了，而且能夠作為平臺(tái)來運(yùn)行復(fù)雜的應(yīng)用和圖形。但大部分的圖形都是二維的。現(xiàn)在大部分的瀏覽器已經(jīng)實(shí)現(xiàn)了WebGL，它們不僅可以創(chuàng)建二維圖形和應(yīng)用，還可以充分利用GPU，創(chuàng)建漂亮的、高性能的三維應(yīng)用。
直接使用WebGL編程非常復(fù)雜。你需要了解WebGL的內(nèi)部細(xì)節(jié)，學(xué)習(xí)復(fù)雜的著色器語法，才能用好WebGL。Three.js庫提供了一套基于WebGL的、非常易用的JavaScript API，這樣你不必學(xué)習(xí)WebGL的細(xì)節(jié)就可以創(chuàng)建漂亮的三維圖形。
Three.js庫提供了大量功能和API，你可以通過它們直接在瀏覽器中創(chuàng)建三維場(chǎng)景。本書提供了大量的交互式...
首部全面講解Three.js開發(fā)的實(shí)用指南，循序漸進(jìn)講解Three.js的各種功能，通過大量交互示例，深入探索使用開源的Three.js庫創(chuàng)建絢麗三維圖形的實(shí)用方法和技巧。
在過去的兩年里，瀏覽器變得更加強(qiáng)大了，而且能夠作為平臺(tái)來運(yùn)行復(fù)雜的應(yīng)用和圖形。但大部分的圖形都是二維的?，F(xiàn)在大部分的瀏覽器已經(jīng)實(shí)現(xiàn)了WebGL，它們不僅可以創(chuàng)建二維圖形和應(yīng)用，還可以充分利用GPU，創(chuàng)建漂亮的、高性能的三維應(yīng)用。
直接使用WebGL編程非常復(fù)雜。你需要了解WebGL的內(nèi)部細(xì)節(jié)，學(xué)習(xí)復(fù)雜的著色器語法，才能用好WebGL。Three.js庫提供了一套基于WebGL的、非常易用的JavaScript API，這樣你不必學(xué)習(xí)WebGL的細(xì)節(jié)就可以創(chuàng)建漂亮的三維圖形。
Three.js庫提供了大量功能和API，你可以通過它們直接在瀏覽器中創(chuàng)建三維場(chǎng)景。本書提供了大量的交互式示例和代碼，從中你可以學(xué)習(xí)到Three.js提供的所有API。
本書內(nèi)容
第1章講述使用Three.js庫的基本步驟。到這章結(jié)束的時(shí)候，你就可以創(chuàng)建出第一個(gè)Three.js場(chǎng)景。你可以直接在瀏覽器中創(chuàng)建三維場(chǎng)景，并制作動(dòng)畫。
第2章將會(huì)講解Three.js庫使用過程中你所需要理解的基礎(chǔ)組件。你將會(huì)學(xué)習(xí)使用光源、網(wǎng)格、幾何體、材質(zhì)和相機(jī)。通過這章你會(huì)對(duì)Three.js庫提供的各種光源及場(chǎng)景中使用的相機(jī)有一個(gè)大體的了解。
第3章進(jìn)一步講解場(chǎng)景中的各種光源。該章會(huì)展示幾個(gè)例子，并解釋如何使用各種光源，該章所介紹的光源包括：SpotLight、DirectionLight、AmbientLight、PointLight、HemisphereLight，以及AreaLight。另外，該章還展示如何在光源中應(yīng)用LensFlare效果。
第4章討論Three.js庫中可以用于網(wǎng)格的各種材質(zhì)。這一章將會(huì)展示所有可以在材質(zhì)中設(shè)置的屬性，每種屬性都有其特定的用途。并且這章還提供交互式的例子，通過它們你可以試驗(yàn)Three.js庫中各種可用的材質(zhì)。
第5章開始探討Three.js庫中的各種幾何體。在這一章里你會(huì)學(xué)習(xí)如何創(chuàng)建、設(shè)置Three.js里的幾何體，而且你還可以通過交互式的示例來試驗(yàn)，該章介紹的幾何體包括：平面、圓、自定義形狀、方塊、球體、圓柱體、圓環(huán)、環(huán)面紐結(jié)和多面體。
第6章繼續(xù)第5章未講完的內(nèi)容，展示如何設(shè)置、使用Three.js庫中的高級(jí)幾何體，例如凸面體和掃描體。該章將會(huì)介紹如何從二維幾何體中拉出三維幾何體，以及如何使用二元運(yùn)算將幾何體組合起來。
第7章講解如何使用Three.js庫中的粒子系統(tǒng)。你將會(huì)學(xué)習(xí)如何從零開始創(chuàng)建粒子系統(tǒng)，以及如何基于已有的幾何體創(chuàng)建粒子系統(tǒng)。你還會(huì)學(xué)習(xí)如何使用精靈和粒子材質(zhì)來改變粒子的外觀。
第8章展示如何從外部源導(dǎo)入網(wǎng)格和幾何體。你將會(huì)學(xué)習(xí)如何使用Three.js庫的JSON格式來存儲(chǔ)幾何體和場(chǎng)景。這一章還解釋了如何從OBJ、DAE、STL、CTM和PLY格式的文件中加載模型。
第9章探討各種動(dòng)畫效果，使場(chǎng)景活動(dòng)起來。你將會(huì)學(xué)習(xí)如何結(jié)合Tween.js庫使用Three.js，以及基于變形和骨骼的動(dòng)畫效果。
第10章進(jìn)一步展開討論第4章引入的材質(zhì)。這一章會(huì)深入講解材質(zhì)的細(xì)節(jié)。該章介紹了各種可用的材質(zhì)，以及應(yīng)用到網(wǎng)格上時(shí)如何控制材質(zhì)。另外，在這一章你還會(huì)看到如何將HTML5視頻的輸出和HTML5畫布中的元素作為紋理。
第11章探討如何使用Three.js庫來對(duì)已經(jīng)渲染過的場(chǎng)景進(jìn)行后期處理。通過后期處理，你可以對(duì)已經(jīng)渲染過的場(chǎng)景應(yīng)用某些特效，如模糊、移軸、陳舊。另外，你還會(huì)學(xué)習(xí)如何創(chuàng)建自定義的后期處理效果，以及創(chuàng)建自定義頂點(diǎn)和片段著色器。
第12章講解如何在Three.js的場(chǎng)景中添加物理效果。有了物理效果后，你就可以檢測(cè)物體之間的碰撞，使它們能夠?qū)χ亓Ξa(chǎn)生反應(yīng)，并產(chǎn)生摩擦。這一章將會(huì)展示如何使用JavaScript的物理庫來達(dá)到上述效果。
閱讀之前的準(zhǔn)備
閱讀本書你要準(zhǔn)備的只是一個(gè)文本編輯器（例如Sublime文本編輯器），用來編輯示例，以及一個(gè)現(xiàn)代的瀏覽器，用來顯示這些示例。有些示例需要一個(gè)本地的Web服務(wù)器，但是在第1章，你將會(huì)學(xué)習(xí)如何搭建一個(gè)非常輕量的Web服務(wù)器來使用本書中的示例。
在我們開始之前，先對(duì)書中示例可能出現(xiàn)的問題簡(jiǎn)單提一下。第1章大致介紹了一下支持WebGL的瀏覽器，這是運(yùn)行Three.js所必需的?，F(xiàn)在的瀏覽器，諸如Chrome、Firefox和Internet Explorer可以很好地支持HTML5 標(biāo)準(zhǔn)。但是仍然有一些細(xì)節(jié)要注意。當(dāng)瀏覽器有新的版本時(shí)，它們有可能會(huì)不支持WebGL的某些特性。例如，在本書完成的時(shí)候，Windows 7上的Chrome和Firefox在運(yùn)行第11章的例子時(shí)會(huì)有問題。所以在嘗試這些示例時(shí)，請(qǐng)確保升級(jí)到最新版的Chrome和Firefox。