Three.js 3D 引擎详解与应用开发培训-中科信软培训中心

WebGL 基础巩固：主要全面巩固WebGL 基础内容，全面梳理WebGL基础知识点，Three.js是基于WebGl API的封装，全面了解WebGL有助于更好的理解Threejs各项API背后逻辑和基本概念。
目标：掌握前端开发重点内容，熟悉WebGL基本原理	1. 前端基础前端重点内容项目搭建 2.WebGL 基础 WebGL 基本原理 WebGL 是如何工作的 WebGL 着色器和 GLSL 3.图像处理： WebGL 图像处理 4.2D 转换、旋转、伸缩、矩阵 WebGL 2D 图像转换 WebGL 2D 图像旋转 WebGL 2D 图像伸缩 WebGL 2D 矩阵
目标：熟悉WebGL基本原理，尝试动手完成一个WebGL项目	1. 3D WebGL 3D 正交 WebGL 3D 透视 WebGL 3D 摄像机 2.结构与组织 WebGL 更少代码，更多乐趣 WebGL 绘制多个东西 WebGL 场景图 3. WebGL实践
WebGL 基础巩固：主要全面巩固WebGL 基础内容，全面梳理WebGL基础知识点，Three.js是基于WebGl API的封装，全面了解WebGL有助于更好的理解Threejs各项API背后逻辑和基本概念。
目标：熟悉Threejs基本原理，重点了解场景，相机，顶点等概念	1. Threejs第一个3D场景(HTML框架文件) 创建HTML 旋转动画、requestAnimationFrame周期性渲染鼠标操作三维场景旋转缩放场景插入新的几何体设置材质效果光照效果设置 2. 顶点概念、几何体结和顶点位置数据解析渲染顶点颜色数据插值计算顶点法向量数据光照计算顶点索引复用顶点数据设置Geometry顶点位置、顶点颜色数据 Face3对象定义Geometry的三角面访问几何体对象的数据几何体旋转、缩放、平移变换 3. 材质对象 1.常用材质介绍 2.材质共有属性、私有属性
目标：熟悉Threejs基本原理，重点了解光源，层级模型，几何体等概念，通过当日内容进行课堂实践，加深理解	1. 点线面模型对象点、线、网格模型介绍模型对象旋转平移缩放变换对象克隆clone复制copy 2. 光源对象光照原理和常见光源类型阴影投影计基类Light和Object3D 3. 层级模型、树结构组对象Group、层级模型对象节点命名、查找、遍历本地位置坐标、世界位置坐标 4. 几何体对象、曲线、三维建模常见几何体和曲线API介绍圆弧线绘制(直线、椭圆、圆弧)、基类Curve 样条曲线、贝赛尔曲线多个线条组合曲线CurvePath 曲线路径管道成型TubeGeometry 旋转成型LatheGeometry Shape对象和轮廓填充ShapeGeometry 拉伸扫描成型ExtrudeGeometry Threejs
Threejs 详解：第三天主要进入Threejs收尾内容详解Threejs剩余API，结合第二天内容完成第一个Threejs项目制作
目标：熟悉Threejs基本原理，重点了解纹理贴图，相机。	1. 纹理贴图创建纹理贴图 UV映射原理(顶点纹理坐标) 数组材质、材质索引materialIndex 纹理对象Texture(阵列、偏移、旋转...) canvas画布、视频作为纹理贴图凹凸贴图、法线贴图(压缩模型) 光照贴图添加阴影高光贴图环境贴图 10.数据纹理对象DataTexture 2. 相机对象(投影方式) 正投影和透视投影相机窗口变化自适应渲染 3. 精灵模型、粒子系统精灵模型对象Sprite 中国城市PM2.5可视化案例树林效果下雨场景效果模拟
目标：熟悉Threejs基本原理，通过两天内容可以独立完成Threejs项目开发	1. 帧动画模块编辑关键帧并解析播放解析外部模型的的帧动画播放设置(暂停、时间段、时间点) 2. 骨骼动画、变形动画骨骼动画原理加载外部模型骨骼动画变形目标动画原理解析外部模型变形目标数据 3. 模型文件加载 Three.js数据结构、导入导出加载stl文件并解析加载obj文件(几何体、材质、贴图) 加载FBX并解析骨骼动画手镯在线预览(商品展示) 4. Threejs 项目实践完成DIY项目 5. Threejs 社区分享，优秀插件介绍