Three.js之初体验

前言

Three.js  = 3D + Javascript 就是使用JS建3d模，底层是Canvas和WebGL渲染器来制作，Three.js将底层的原理进行对象的封装

概括

1. 对象分为Scene、Camera、Renderer（场景、相机、渲染器）
2. 场景负责增加Camera,Mesh,Light这些内容
3. Camera分为正投相机和透视相机，区别在于多个物体的远近视角问题。
4. 渲染器也分很多类别，主要对于浏览器的兼容性或者渲染性能来做出选择

坐标系

1. 相机坐标系：数学的右手坐标系；X轴正向指向右边，Y轴正向指向上边，Z轴正向垂直屏幕；相机坐标系代表相机放在坐标系的位置
2. 相机拍摄方向使用LookAt()方法；主要设置相机拍摄的方向，多指向原点

光线

1. 光线Light分为环境光(可理解到处都有光发出来)、点光(像蜡烛发出来的光)、聚光灯、平行光
2. 当我们没有设置光线的时候，因场景背景默认黑色、没光线相当于你看不见该3D模型，需要经过光的反射才能显示模型

材质

1. 模型的制作材料。可以自定义颜色或者贴图制作模型的材料。也可以导入材质文件作为材质等等

加载器

1. 加载器3D模型加载器和材质加载器；
2. 当我们不会自己去建3D模型的时候，可以借助工业设计上的3D模型导出文件来进行导入。格式多样化。Three.js也提供多类型的加载器。