THREE.js-------3D模型制作demo总结

渲染简单的3D模型要有的结构：场景，相机，渲染器 。

下图是three.js中文文档截取的思维导图。

（1）场景(Scene): 
场景是[物体,光源等元素]的容器。实时调整和场景相关的所有对象数据,包括物体,光源等.创建场景,需要引入three.js文件，let scene = new THREE.Scene();
（2）相机（Camera)
在three.js中，摄像机的作用就是不断的拍摄我们创建好的场景，然后通过渲染器渲染到屏幕中。想通过不同的角度观看场景，就需要修改摄像机的位置来拍摄场景。
这里主要说一下透视相机，PerspectiveCamera（透视摄像机）。
第一个参数是视野角度（FOV）。视野角度就是无论在什么时候，你所能在显示器上看到的场景的范围，它的单位是角度(与弧度区分开)。
第二个参数是长宽比（aspect ratio）。 也就是你用一个物体的宽除以它的高的值。比如说，当你在一个宽屏电视上播放老电影时，可以看到图像仿佛是被压扁的。
接下来的两个参数是近截面（near）和远截面（far）。 当物体某些部分比摄像机的远截面远或者比近截面近的时候，该这些部分将不会被渲染到场景中。或许现在你不用担心这个值的影响，但未来为了获得更好的渲染性能，你将可以在你的应用程序里去设置它。
（3）渲染器（WebGLRenderer）
let renderer = new THREE.WebGLRenderer();
setSize   方法设置尺寸大小
setClearColor  方法设置背景颜色
（4）渲染，可全屏渲染，也可以局部渲染
全屏渲染
document.body.appendChild(renderer.domElement);
局部渲染
document.getElementById('pos').app