WebGL高級編程：開發Web3D圖形
目錄
WebGL簡介1
1.1 WebGL基礎1
1.2 瀏覽器3D圖形吸引人的原因2
1.3 設計一個圖形API3
1.3.1 即時模式API3
1.3.2 保留模式API3
1.4 圖形硬件簡介4
1.4.1 GPU4
1.4.2 幀緩存5
1.4.3 紋理存儲器6
1.4.4 視頻控制器6
1.5 WebGL圖形流水線6
1.5.1 頂點着色器8
1.5.2 圖元裝配11
1.5.3 光柵化12
1.5.4 片段着色器12
1.5.5 逐片段操作15
1.6 WebGL與其他圖形技術的比較16
1.6.1 OpenGL16
1.6.2 OpenGL ES 2.018
1.6.3 Direct3D19
1.6.4 HTML5畫布21
1.6.5 可縮放矢量圖形25
1.6.6 VRML與X3D26
1.7 線性代數簡介27
1.7.1 坐標系27
1.7.2 點與頂點27
1.7.3 矢量28
1.7.4 矢量的點積或標積29
1.7.5 叉積30
1.7.6 齊次坐標31
1.7.7 矩陣31
1.7.8 仿射變換34
1.8 小結39
第2章 創建基本的WebGL示例41
2.1 繪制三角形41
2.1.1 創建WebGL上下文45
2.1.2 創建頂點着色器和片段着色器47
2.1.3 編譯着色器48
2.1.4 創建程序對象和鏈接着色器48
2.1.5 建立緩沖50
2.1.6 繪制場景51
2.2 了解WebGL編碼風格52
2.3 調試WebGL應用程序53
2.3.1 使用Chrome開發人員工具53
2.3.2 Firebug的使用59
2.3.3 WebGL的錯誤處理與錯誤代碼61
2.3.4 WebGL Inspector64
2.3.5 WebGL的故障排除70
2.4 用DOM API載入着色器71
2.5 ***的綜合示例73
2.6 小結77
第3章 繪制79
3.1 使用WebGL繪制圖元和繪圖方法79
3.1.1 圖元80
3.1.2 頂點組繞順序的重要性84
3.1.3 WebGL的繪圖方法85
3.2 類型化數組91
3.2.1 緩沖與視圖91
3.2.2 WebGL支持的視圖類型92
3.3 探討不同的繪圖方法93
3.3.1 gl.drawArrays()和gl.TRIANGLES94
3.3.2 gl.drawArrays()方法和gl.TRIANGLE_STRIP圖元96
3.3.3 gl.drawElements()方法和gl.TRIANGLES圖元98
3.3.4 gl.drawElements()方法和gl.TRIANLE_STRIP圖元100
3.3.5 總結比較102
3.3.6 前期變換頂點緩存和后期變換頂點緩存102
3.4 為提高性能交叉存放頂點數據104
3.5 使用頂點數組或常量頂點數據113
3.6 總結本章的*后一個示例114
3.7 小結124
第4章 小型庫與變換127
4.1 中矩陣和向量的操作127
4.1.1 Sylvester庫128
4.1.2 WebGL-mjs庫132
4.1.3 glMatrix庫135
4.2 變換運算139
4.3 理解完整的變換流水線145
4.4 變換的實踐146
4.4.1 為對象坐標設置緩沖147
4.4.2 用創建變換矩陣並上傳給着色器148
4.4.3 將變換矩陣上傳給GPU中的頂點着色器148
4.4.4 調用繪圖方法149
4.5 理解變換順序的重要性150
4.5.1 使用一個固定的全局的坐標系150
4.5.2 使用移動的局部的坐標系153
4.5.3 變換矩陣的入棧和出棧操作154
4.6 一個完整的示例：繪制幾個變換后的對象157
4.6.1 使用WebGL代碼創建立方體159
4.6.2 視圖變換和模型變換的組織161
4.7 小結162
第5章 紋理貼圖163
5.1 理解丟失上下文164
5.1.1 理解解決丟失上下文問題所需要的設置164
5.1.2 處理丟失上下文問題時需要考慮的幾個因素166
5.2 2D紋理與立方映射紋理169
5.3 載入紋理170
5.3.1 創建WebGLTexture對象170
5.3.2 綁定紋理171
5.3.3 載入圖像數據171
5.3.4 將紋理上傳到GPU173
5.3.5 定義紋理參數174
5.3.6 理解載入紋理的完整過程175
5.3.7 創建一個紋理對象並載入紋理數據177
5.4 定義紋理坐標178
5.5 着色器中的紋理處理180
5.6 處理紋理過濾183
5.6.1 紋理伸展184
5.6.2 紋理收縮185
5.6.3 Mip映射紋理186
5.7 理解紋理坐標包裝188
5.7.1 應用gl.REPEAT包裝模式188
5.7.2 應用gl.MIRRORED_REPEAT包裝模式190
5.7.3 應用gl.CLAMP_TO_EDGE包裝模式191
5.8 一個完整的應用紋理示例191
5.9 獲得用作紋理的圖像194
5.9.1 下載免費紋理194
5.9.2 用自己拍攝的照片生成紋理194
5.9.3 繪制圖像195
5.9.4 購買紋理195
5.10 同域策略與跨域資源共享195
5.10.1 同域策略應用於一般的圖像196
5.10.2 同域策略應用於紋理197
5.10.3 跨域資源共享199
5.11 小結200
第6章 動畫與用戶輸入203
6.1 創建動畫場景203
6.1.1 setInterval()和setTimeout()的使用205
6.1.2 使用requestAnimationFrame()函數206
6.1.3 幀頻不同引起的運動補償209
6.1.4 創建FPS計數器測量動畫的平穩性210
6.1.5 用FPS作為測量值的缺點212
6.2 用戶交互事件的處理213
6.2.1 DOM Level 0基本事件處理214
6.2.2 DOM Level 2——**事件處理方法215
6.2.3 鍵盤輸入217
6.2.4 鼠標輸入221
6.3 綜合應用新知識223
6.4 小結229
第7章 光照231
7.1 光源231
7.2 局部光照模型的工作原理232
7.3 Phong反射模型232
7.3.1 環境反射233
7.3.2 漫反射234
7.3.3 鏡面反射236
7.3.4 Phong反射模型的完整公式和着色器239
7.3.5 光照效果與紋理相結合243
7.4 WebGL光照中需要的代碼246
7.4.1 為頂點法線設置緩存247
7.4.2 計算法線矩陣並上傳給着色器249
7.4.3 將光照信息上傳給着色器250
7.5 將不同的插值方法用於着色250
7.5.1 平面着色251
7.5.2 Gouraud着色252
7.5.3 Phong着色253
7.6 矢量必須歸一化256
7.6.1 頂點着色器中的矢量歸一化257
7.6.2 片段着色器的矢量歸一化257
7.7 應用不同類型的光源258
7.7.1 平行光258
7.7.2 點光源259
7.7.3 聚光源259
7.8 光強衰減262
7.9 光照映射265
7.10 小結267
第8章 WebGL性能優化269
8.1 WebGL底層工作機制269
8.1.1 支持WebGL的硬件270
8.1.2 關鍵的軟件組成271
8.2 WebGL性能優化274
8.2.1 避免初學者的典型錯誤274
8.2.2 確定瓶頸位置275
8.2.3 有關性能的一般性建議279
8.2.4 改善CPU受限的WebGL應用程序性能的建議282
8.2.5 改善頂點受限的WebGL應用程序性能的建議283
8.2.6 改善像素受限的WebGL應用程序性能的建議285
8.3 深入分析融合286
8.3.1 融合簡介286
8.3.2 設置融合函數287
8.3.3 繪制順序與深度緩沖區290
8.3.4 繪制包含不透明對象和半透明對象的場景290
8.3.5 修改融合公式中的默認運算符291
8.3.6 使用預乘alpha值292
8.4 深入討論WebGL292
8.4.1 使用WebGL框架293
8.4.2 發布到Google Chrome Web Store293
8.4.3 使用額外資源293
8.5 小結294
下載地址：https://pan.baidu.com/s/1ro5Ma0Y4_CVIr0eVft26NQ
關注微信公眾號獲取提取碼：
輸入：web1 獲取提取碼
