基于HTML5 WebGL的3D圖形庫的設(shè)計與實現(xiàn).pdf

1、WebGL(Web Graphics Library)技術(shù)使得前端開發(fā)者可以使用JavaScript腳本代碼在HTML5canvas元素窗口中繪制三維圖形。直接利用WebGL開發(fā)可交互的三維圖形應(yīng)用既復(fù)雜又費時。開發(fā)者需要了解WebGL的內(nèi)部細(xì)節(jié)，學(xué)習(xí)復(fù)雜的著色器語法，才能用好WebGL。因此，前端開發(fā)者通常使用一個封裝了WebGL功能的類庫來進(jìn)行三維圖形應(yīng)用的開發(fā)，該類庫要能為開發(fā)者提供一套非常易用的JavaScript API。這樣

2、在不必學(xué)習(xí)WebGL細(xì)節(jié)的情況下，開發(fā)者也可以使用這些API創(chuàng)建漂亮的三維圖形。本文所設(shè)計和實現(xiàn)的3D圖形庫就是這樣一個類庫。因此，本文的主要工作如下:
　　(1)分析現(xiàn)有的基于WebGL的3D圖形庫，設(shè)計3D圖形庫的大部分功能。為開發(fā)者提供場景、相機、渲染器來繪制三維圖形;利用層次結(jié)構(gòu)組織場景中的三維圖形，以此方便三維圖形的定位和變換;使用骨骼以及骨骼混合算法進(jìn)行三維圖形的變形;為三維圖形設(shè)計并實現(xiàn)補間動畫等。
　　(2)

3、解決大部分3D圖形庫不將圖形選取和碰撞當(dāng)作事件來處理的問題，使用射線處理三維圖形的選取然后產(chǎn)生選取事件，使用層次包圍盒算法進(jìn)行碰撞檢測然后產(chǎn)生碰撞事件，以此設(shè)計并實現(xiàn)3D圖形庫自己的事件處理機制。
　　(3)使用AABB層次包圍盒來提高檢測圖形選取和碰撞事件的效率，并改進(jìn)AABB層次包圍盒的更新方法，進(jìn)一步提高算法的效率。
　　(4)提供載入外部模型文件的方法，以便開發(fā)者使用復(fù)雜的三維圖形。
　　(5)對3D圖形庫功能