视频课程地址： www.bilibili.com/video/BV1g4…
一、three.js概述
我们知道三维程序都是运行在OpenGL和微软公司的DirectX的基础上的。我们在十年前常见的PC端大型游戏，都是基于他们开发的。随着硬件性能的不断提高，现在在手机上或网页上的三维游戏也非常普及，但在手机上和网页上则没有PC上那么多的资源与权限。
所以OpenGL标准委员会就在之前的OpenGL的基础上开发了一个缩减版的OpenGL叫做OpenGL ES。目前,智能手机操作系统都是基于OpenGL ES版本开发的三维系统。
为了能在浏览器上运行三维程序，就在OpenGL ES 2.0的基础上开发出来的WebGL标准。它是一种3D绘图协议，允许把JavaScript和OpenGL ES 2.0结合在一起，通过增加OpenGL ES 2.0的一个JavaScript的绑定。WebGL可以为HTML5-Canvas提供硬件3D加速渲染。这样Web开发人员就可以借助系统显卡来在浏览器里更流畅的展示3D场景和模型了，还能创建复杂的导航和数据视觉化。
显然,WebGL技术标准免去了开发网页专用渲染插件的麻烦，可被用于创建具有复杂3D结构的网站页面，甚至可以用来设计3D网页游戏等。
上图所示：WebGL技术设计的3D网页游戏
WebGL的功能非常强大，如果我们直接使用WebGL编程来从JavaScript 创建三维动画场景则十分复杂，而且非常容易出错。three.js就是在这样的背景下应运而生的。
three.js可以带来以下几个好处:
第一、创建简单和复杂的三维几何的图形；
第二、创建虚拟现实（VR）二和增强现实（AR）场景；
第三、在三维场景下创建动画和移动物体；
第四、为物体添加纹理和材质；
第五、使用各种光源来装饰场景；
第六、加载三维模型软件所创建的物体；
第七、为三维场景添加高级的后期处理效果；
第八、使用自定义的着色器；
第九、创建点云（即粒子系统）。
二、准备工作
接下来我们开始做一下准备工作。首先我们写代码用的是微软公司visual studio code，简称 VSCode 。点击首页的下载按钮，把VSCode下载，并且安装好。
上图所示：coke.visualstudio.com官网下载VS Code
由于三维程序的运行需要，启动本地的服务器。所以我们在VSCode上安装一个Live Server插件。
上图所示：在VSCode上安装一个Live Server插件
为了更好的测试本视频课程运行的效果，建议安装谷歌公司的chrome。以上两步的准备工作做好之后，我们现在来下载three.js 的源码。
三、three.js源码获取
在three.js 的github上的官方主页，点击Code按钮的下拉菜单，找到Zip包下载项，等待十分钟后代码就下载完成了。
上图所示：github官方主页下载three.js 的源码
现在我们解压代码压缩包，看一下代码的目录结构。我们先来看一下src目录。src目录里面包含了three.js 的所有实现代码和接口文件，也是我们后面所有的小例子程序都是需要用到的。
上图所示：src目录
我们再来看一下docs目录。docs目录里面包含了three.js 的所有帮助文档。
上图所示：docs目录
example目录里面包含了three.js 的所有样例程序。
上图所示：example目录
editor目录里面包含了three.js 四代的场景编辑器工具。还有好几个其他目录与我们当前的课程关系不大，所以我们留待以后再来详细介绍。
作者：动力IT实训
视频课程地址： www.bilibili.com/video/BV1g4…
