WebGL編程培訓
? WebGL編程培訓
課程大綱：
1WebGL概述
1.1?系統需求
1.2?WebGL提供的渲染類型
1.3?WebGL應用程序結構
1.4?HTML?5?canvas的生成方式
1.5訪問WebGL上下文環境
1.6?WebGL狀態機
1.7加載3D場景
2渲染幾何體
2.1頂點和索引
2.2?WebGL渲染管線概述
2.3在WebGL中渲染幾何體
2.4將屬性關聯至VBO
2.5渲染機制
2.6整合過程
2.7渲染模式
2.8緩沖區操控
2.9高級幾何體加載技術：JSON和AJAX
2.10使用AJAX+JSON加載圓錐體對象
3光照
3.1光照、法線和材質
3.2在管線中使用光源、法線和材質
3.3著色方案和光照反射模型
3.4OpenGL?ES著色語言ESSL
3.5編寫ESSL程序
3.6返回至WebGL
3.7位置光源
4相機
4.1?WebGL不存在相機對象
4.2法線轉換
4.3?WebGL實現方式
4.4模型，視見矩陣
4.5相機矩陣
4.6透視矩陣
4.7?WebGL示例結構
5實現方案
5.1?矩陣棧
5.2?3D場景的動畫操作
5.3計時策略
5.4體系結構更新
5.5連接矩陣棧和JavaScript計時器
5.6參數曲線
5.7優化策略
5.8插值方案
6顏色、深度測試以及Alpha混合
6.1?在WebGL中使用顏色
6.2使用對象中的顏色
6.3使用光照顏色
6.4體系結構的更新操作
6.5通過jQuery?Ul實現互動性
6.6有向點光源
6.7使用場景中的顏色值
6.8深度測試
6.9?Alpha混合操作
6.10生成透明對象
7紋理
7.1紋理貼圖
7.2生成并加載紋理
7.3使用紋理坐標
7.4著色器中的紋理應用
7.5紋理過濾模式
7.6紋理環繞模式
7.7多重紋理
7.8立方體貼圖
8拾取操作
8.1拾取操作概述
8.2構造離屏幀緩沖區
8.3場景中的顏色賦值
8.4渲染至離屏幀緩沖區
8.5?canvas上的拾取行為
8.6從離屏幀緩沖區中讀取像素
8.7尋找擊中對象
8.8處理擊中對象
8.9體系結構的更新操作
8.10拾取器的體系結構
8.11實現唯一顏色標記
9整合方案
9.1創建WebGL應用程序
9.2體系結構回顧
9.3虛擬汽車陳列室應用程序
9.4著色器實現
9.5?構建場景
9.6配置WebGL屬性
9.7加載汽車模型
9.8渲染操作
10高級話題
10.1后處理技術
10.2框架更新
10.3測試后處理效果
10.4點精靈對象
10.5火花效果
10.6法線貼圖
10.7法線貼圖示例
10.8片元著色器中的光線跟蹤機制
10.9場景的光線跟蹤測試