随着元宇宙、数字孪生的火热，前端3D可视化需求越来越广泛，懂 WebGL 技术的前端人才也成为行业香饽饽，薪资诱人颇有竞争力。本课程系统组织了WebGL 和 Three.js 知识内容，并结合图形学相关的数学知识，带你从0基础入门，体系化学习它们的基本、进阶、高级用法。最终通过一款高质量的 3D 可视化项目-智慧城市，让你顺利将 WebGL 和 Three.js 技术落地，掌握其实际应用。

├──{1}–第1章课程开篇
| ├──[1.1]–1-1课程导学.mp4 44.95M
| └──[1.2]–1-2课程简介.mp4 22.39M
├──{2}–第2章WebGL简单应用：学习WebGL简单使用，建立WebGL
| ├──[2.1]–2-1canvas和webgl的区别.mp4 21.03M
| ├──[2.2]–2-2认识webgl，了解webgl.mp4 77.96M
| ├──[2.3]–2-3webgl入门-给画布换个颜色.mp4 56.93M
| ├──[2.4]–2-4绘制一个点.mp4 226.54M
| ├──[2.5]–2-5介绍webgl三维坐标系.mp4 63.06M
| ├──[2.6]–2-6学习使用attribute变量-绘制一个水平移动的点.mp4 88.20M
| ├──[2.7]–2-7通过鼠标控制绘制.mp4 95.86M
| └──[2.8]–2-8使用uniform变量-绘制不同颜色的点.mp4 83.41M
├──{3}–第3章WebGL多图形绘制和动画
| ├──[3.10]–3-10图形复合变换-矩阵组合.mp4 78.60M
| ├──[3.1]–3-1使用缓冲区对象-绘制多个点.mp4 88.58M
| ├──[3.2]–3-2多缓冲区和数据偏移.mp4 49.71M
| ├──[3.3]–3-3实现多种图形绘制.mp4 50.31M
| ├──[3.4]–3-4图形平移-着色器.mp4 27.62M
| ├──[3.5]–3-5图形缩放-着色器.mp4 13.16M
| ├──[3.6]–3-6图形旋转-着色器.mp4 33.25M
| ├──[3.7]–3-7图形平移-平移矩阵.mp4 114.36M
| ├──[3.8]–3-8图形缩放-缩放矩阵.mp4 43.31M
| └──[3.9]–3-9图形旋转-旋转矩阵.mp4 91.63M
├──{4}–第4章WebGL颜色和纹理
| ├──[4.1]–4-1使用varying变量-绘制彩色三角形.mp4 28.15M
| ├──[4.2]–4-2从顶点到图形–webgl渲染流程介绍.mp4 14.95M
| ├──[4.3]–4-3给图形添加背景图.mp4 154.77M
| └──[4.4]–4-4使用多重纹理.mp4 56.12M
├──{5}–第5章WebGL原理学习：OpenGLES语言
| ├──[5.1]–5-1OpenGLES语言基础.mp4 47.60M
| ├──[5.2]–5-2矢量和矩阵.mp4 18.88M
| ├──[5.3]–5-3纹理取样器.mp4 18.37M
| ├──[5.4]–5-4分支和循环.mp4 9.27M
| ├──[5.5]–5-5函数.mp4 18.55M
| ├──[5.6]–5-6内置函数介绍.mp4 15.84M
| └──[5.7]–5-7存储限定词.mp4 20.30M
├──{6}–第6章WebGL三维世界
| ├──[6.1]–6-13D基础.mp4 136.57M
| ├──[6.2]–6-2正射投影.mp4 88.72M
| ├──[6.3]–6-3透视投影.mp4 166.86M
| ├──[6.4]–6-4立方体绘制（顶点法）.mp4 81.76M
| └──[6.5]–6-5立方体绘制（索引法）.mp4 80.16M
├──{7}–第7章webgl光照
| ├──[7.1]–7-1光是如何使用的.mp4 35.89M
| └──[7.2]–7-2给场景添加光源.mp4 72.04M
├──{8}–第8章WebGL进阶操作
| ├──[8.1]–8-1雾化.mp4 103.20M
| ├──[8.2]–8-2绘制圆形的点.mp4 32.98M
| └──[8.3]–8-3绘制半透明物体.mp4 19.53M
├──{9}–第9章【Threejs基础】简单实现一些阴影、雾化的效果
| ├──[9.1]–9-1什么是threejs.mp4 19.62M
| ├──[9.2]–9-2渲染三维对象.mp4 79.19M
| ├──[9.4]–9-4添加阴影效果.mp4 55.56M
| └──[9.5]–9-5添加雾化效果.mp4 24.10M
├──{10}–第10章【Threejs组件】每个组件都有其独特的使用方法，可以
| ├──[10.1]–10-1基础组件-Scene.mp4 36.95M
| ├──[10.2]–10-2基础组件-几何体.mp4 11.67M
| ├──[10.3]–10-3基础组件-正射投影相机.mp4 14.70M
| └──[10.4]–10-4基础组件-透视投影相机.mp4 9.28M
├──{11}–第11章【Threejs光源】相信光，能照亮场景的每个角落，一个
| ├──[11.1]–11-1光源类型.mp4 14.42M
| ├──[11.2]–11-2聚光灯光源.mp4 117.80M
| ├──[11.3]–11-3环境光.mp4 31.93M
| ├──[11.4]–11-4点光源.mp4 23.73M
| ├──[11.5]–11-5平行光.mp4 37.07M
| └──[11.6]–11-6半球光.mp4 35.13M
├──{12}–第12章【threejs材质】不同的材质能呈现出不同的效果，合适
| ├──[12.10]–12-10联合材质.mp4 21.84M
| ├──[12.1]–12-1材质简介.mp4 29.71M
| ├──[12.2]–12-2基础材质.mp4 37.18M
| ├──[12.3]–12-3深度材质.mp4 32.18M
| ├──[12.4]–12-4法向材质.mp4 26.16M
| ├──[12.5]–12-5面材质.mp4 16.12M
| ├──[12.6]–12-6郎伯材质.mp4 29.13M
| ├──[12.7]–12-7Phong材质.mp4 27.09M
| └──[12.8]–12-8着色器材质.mp4 42.33M
├──{13}–第13章【Threejs几何体】还在为物体坐标烦恼吗？内置几何体
| ├──[13.10]–13-10多面体.mp4 59.18M
| ├──[13.11]–13-11文字.mp4 56.47M
| ├──[13.1]–13-1几何体简介.mp4 7.74M
| ├──[13.2]–13-2二维平面.mp4 128.03M
| ├──[13.3]–13-3二维圆.mp4 56.66M
| ├──[13.4]–13-4自定义二维图形.mp4 21.58M
| ├──[13.5]–13-5立方体.mp4 38.30M
| ├──[13.6]–13-6球体.mp4 34.72M
| ├──[13.7]–13-7圆柱体.mp4 29.46M
| ├──[13.8]–13-8圆环.mp4 47.07M
| └──[13.9]–13-9纽结.mp4 45.00M
├──{14}–第14章【Threejs动画和相机】不同的角度看到的景色是不一样
| ├──[14.1]–14-1基础动画.mp4 5.64M
| ├──[14.3]–14-3点击选取对象.mp4 68.04M
| ├──[14.4]–14-4加载外部文件.mp4 36.88M
| ├──[14.5]–14-5使用相机控件.mp4 62.24M
| └──[14.6]–14-6实战：实现骨骼动画.mp4 185.56M
├──{15}–第15章【Threejs纹理】场景不再单一，丰富多了
| ├──[15.1]–15-1基础纹理.mp4 45.86M
| ├──[15.2]–15-2凹凸贴图.mp4 45.95M
| ├──[15.3]–15-3法向贴图.mp4 51.24M
| ├──[15.4]–15-4环境贴图.mp4 90.46M
| ├──[15.5]–15-5canvas贴图.mp4 35.15M
| └──[15.6]–15-6实战：实现辉光效果.mp4 109.48M
├──{16}–第16章【Threejs粒子】舞动的精灵，你值得拥有
| ├──[16.1]–16-1粒子和粒子系统.mp4 55.45M
| ├──[16.2]–16-2使用粒子实现水波效果.mp4 82.11M
| └──[16.3]–16-3粒子组合成立方体.mp4 108.73M
├──{17}–第17章【智慧城市实战】基础内容怎么样了？来实战一下吧
| ├──[17.10]–17-10添加场景扫描线.mp4 79.38M
| ├──[17.11]–17-11特效：雷达效果.mp4 91.55M
| ├──[17.12]–17-12特效：透明墙.mp4 99.29M
| ├──[17.13]–17-13特效：地面扩散.mp4 59.40M
| ├──[17.14]–17-14特效：扩散半球.mp4 36.36M
| ├──[17.15]–17-15特效：旋转四棱锥.mp4 61.14M
| ├──[17.16]–17-16特效：飞线.mp4 115.06M
| ├──[17.17]–17-17特效：路径移动.mp4 26.58M
| ├──[17.18]–17-18场景文字添加.mp4 64.20M
| ├──[17.19]–17-19天气：冬雪.mp4 148.17M
| ├──[17.1]–17-1blender基础使用.mp4 26.13M
| ├──[17.20]–17-20天气：夏雨.mp4 125.36M
| ├──[17.21]–17-21跟随鼠标缩放.mp4 61.14M
| ├──[17.23]–17-23烟雾预警.mp4 173.47M
| ├──[17.2]–17-2通过blender创建城市模型.mp4 63.52M
| ├──[17.3]–17-3创建项目及场景添加.mp4 116.35M
| ├──[17.4]–17-4加载城市模型.mp4 130.83M
| ├──[17.5]–17-5背景天空盒.mp4 45.74M
| ├──[17.6]–17-6添加交互效果.mp4 79.35M
| ├──[17.7]–17-7给建筑物添加渐变色.mp4 75.66M
| ├──[17.8]–17-8创建建筑物外围线条.mp4 48.64M
| └──[17.9]–17-9添加建筑物扫描线.mp4 60.78M
├──{18}–第18章番外篇：webgl里的数学
| ├──[18.10]–18-10番外10旋转矩阵.mp4 8.47M
| ├──[18.1]–18-1番外1三角函数.mp4 31.38M
| ├──[18.2]–18-2番外2向量乘以标量.mp4 22.46M
| ├──[18.3]–18-3番外3向量长度计算.mp4 9.50M
| ├──[18.4]–18-4番外4两个向量的距离.mp4 47.63M
| ├──[18.5]–18-5番外5归一化.mp4 8.74M
| ├──[18.6]–18-6番外6点积.mp4 41.72M
| ├──[18.7]–18-7番外7叉积.mp4 51.19M
| ├──[18.8]–18-8番外8向量运算.mp4 28.82M
| └──[18.9]–18-9番外9矩阵运算.mp4 65.16M
└──课件
| ├──city-real-time-master.zip 13.05M
| └──city_ppt-master.zip 9.13M