这书根据很多的互动实例和实例编码详细介绍了Three.js出示的各种各样API，让阅读者不用掌握没办法程序编写的WebGL的最底层关键点及繁杂的上色語言，只需大概掌握JavaScript及HTML，就能轻轻松松地在电脑浏览器中建立二维和三维运用及图型。这书共12章，涉及到以下几点：应用Three.js建立三维情景，搭建情景的基础部件，Three.js中的灯源、材料、立体图形及其物体、小精灵和云数据，建立和载入网格图、立体图形，建立动漫和挪动监控摄像头，载入和应用纹路，自定着色器和后期制作，在情景中加上物理学实际效果和响声等。
目录
- 前言
- 第1章 使用Three. js创建你的第一个三维场景1
- 1.1 准备工作4
- 1.2 获取源码5
- 1.2.1 通过Git获取代码仓库5
- 1.2.2 下载并解压缩档案文件5
- 1.2.3 测试示例6
- 1.3 搭建HTML框架9
- 1.4 渲染并查看三维对象10
- 1.5 添加材质、光源和阴影效果14
- 1.6 让你的场景动起来16
- 1.6.1 引入requestAnimationFrame()方法16
- 1.6.2 旋转立方体17
- 1.6.3 弹跳球18
- 1.7 使用dat.GUI简化试验流程19
- 1.8 场景对浏览器的自适应21
- 1.9 总结22
- 第2章 构建Three.js场景的基本组件23
- 2.1 创建场景23
- 2.1.1 场景的基本功能24
- 2.1.2 给场景添加雾化效果29
- 2.1.3 使用overrideMaterial属性30
- 2.2 几何体和网格31
- 2.2.1 几何体的属性和方法31
- 2.2.2 网格对象的属性和方法36
- 2.3 选择合适的摄像机40
- 2.3.1 正交投影摄像机和透视投影摄像机40
- 2.3.2 将摄像机聚焦在指定点上44
- 2.4 总结45
- 第3章 学习使用Three.js中的光源46
- 3.1 Three.js中不同种类的光源46
- 3.2 基础光源47
- 3.2.1 THREE.AmbientLight47
- 3.2.2 THREE.PointLight51
- 3.2.3 THREE.SpotLight54
- 3.2.4 THREE.DirectionalLight58
- 3.3 特殊光源60
- 3.3.1 THREE.HemisphereLight60
- 3.3.2 THREE.AreaLight61
- 3.3.3 镜头光晕64
- 3.4 总结66
- 第4章 使用Three.js的材质67
- 4.1 理解材质的共有属性68
- 4.1.1 基础属性68
- 4.1.2 融合属性69
- 4.1.3 高级属性70
- 4.2 从简单的网格材质开始70
- 4.2.1 THREE.MeshBasicMaterial71
- 4.2.2 THREE.MeshDepthMaterial73
- 4.2.3 联合材质75
- 4.2.4 THREE.MeshNormalMaterial76
- 4.2.5 THREE.MeshFaceMaterial78
- 4.3 高级材质81
- 4.3.1 THREE.MeshLambertMaterial81
- 4.3.2 THREE.MeshPhongMaterial82
- 4.3.3 用THREE.ShaderMaterial创建自己的着色器83
- 4.4 线性几何体的材质89
- 4.4.1 THREE.LineBasicMaterial89
- 4.4.2 THREE.LineDashedMaterial91
- 4.5 总结92
- 第5章 学习使用几何体93
- 5.1 THREE.js提供的基础几何体94
- 5.1.1 二维几何体94
- 5.1.2 三维几何体102
- 5.2 总结112
- 第6章 高级几何体和二元操作113
- 6.1 THREE.ConvexGeometry113
- 6.2 THREE.LatheGeometry115
- 6.3 通过拉伸创建几何体116
- 6.3.1 THREE.ExtrudeGeometry117
- 6.3.2 THREE.TubeGeometry119
- 6.3.3 从SVG拉伸120
- 6.3.4 THREE.ParametricGeometry122
- 6.4 创建三维文本124
- 6.4.1 渲染文本124
- 6.4.2 添加自定义字体126
- 6.5 使用二元操作组合网格127
- 6.5.1 subtract函数129
- 6.5.2 intersect函数132
- 6.5.3 union函数133
- 6.6 总结134
- 第7章 粒子、精灵和点云135
- 7.1 理解粒子135
- 7.2 粒子、THREE.PointCloud和THREE.PointCloudMaterial138
- 7.3 使用HTML5画布样式化粒子140
- 7.3.1 在THREE.CanvasRenderer中使用HTML5画布140
- 7.3.2 在WebGLRenderer中使用HTML5画布142
- 7.4 使用纹理样式化粒子144
- 7.5 使用精灵贴图149
- 7.6 从高级几何体创建THREE.Point Cloud153
- 7.7 总结155
- 第8章 创建、加载高级网格和几何体156
- 8.1 几何体组合与合并156
- 8.1.1 对象组合156
- 8.1.2 将多个网格合并成一个网格158
- 8.1.3 从外部资源中加载几何体160
- 8.1.4 以Three.js的JSON格式保存和加载161
- 8.1.5 使用Blender165
- 8.1.6 导入三维格式文件169
- 8.2 总结179
- 第9章 创建动画和移动摄像机180
- 9.1 基础动画180
- 9.1.1 简单动画181
- 9.1.2 选择对象182
- 9.1.3 使用Tween.js实现动画184
- 9.2 使用摄像机186
- 9.2.1 轨迹球控制器187
- 9.2.2 飞行控制器189
- 9.2.3 翻滚控制器190
- 9.2.4 第一视角控制器191
- 9.2.5 轨道控制器192
- 9.3 变形动画和骨骼动画193
- 9.3.1 用变形目标创建动画195
- 9.3.2 用骨骼和蒙皮创建动画198
- 9.4 使用外部模型创建动画200
- 9.4.1 使用Blender创建骨骼动画201
- 9.4.2 从Collada模型加载动画203
- 9.4.3 从雷神之锤模型中加载动画204
- 9.5 总结205
- 第10章 加载和使用纹理206
- 10.1 将纹理应用于材质206
- 10.1.1 加载纹理并应用到网格206
- 10.1.2 使用凹凸贴图创建褶皱210
- 10.1.3 使用法向贴图创建更加细致的凹凸和褶皱211
- 10.1.4 使用光照贴图创建阴影效果212
- 10.1.5 使用环境贴图创建反光效果214
- 10.1.6 高光贴图218
- 10.2 纹理的高级用途220
- 10.2.1 自定义UV映射220
- 10.2.2 重复纹理222
- 10.2.3 在画布上绘制图案并作为纹理224
- 10.2.4 将视频输出作为纹理227
- 10.3 总结229
- 第11章 自定义着色器和后期处理230
- 11.1 配置Three.js以进行后期处理230
- 11.2 后期处理通道233
- 11.2.1 简单后期处理通道233
- 11.2.2 使用掩码的高级效果组合器239
- 11.2.3 使用THREE.ShaderPass自定义效果242
- 11.3 创建自定义后期处理着色器248
- 11.3.1 自定义灰度图着色器248
- 11.3.2 自定义位着色器251
- 11.4 总结253
- 第12章 在场景中添加物理效果和声音254
- 12.1 创建基本的Three.js场景254
- 12.2 材质属性259
- 12.3 基础图形260
