这是我参与「第四届青训营 」笔记创作活动的第12天 介绍
介绍，three.js是一个渲染3d效果的强大的js文件，我们通过调用里面的api，定义相机，颜色，场景来实现渲染效果
three.js需要建立服务器来使用，所以需要使用open-server来不断刷新
内容
-
建立模型
-
使用Three.BoxGeometry(100,100,100)
-
对应长宽高
-
-
材质
-
使用材质
-
使用THREE.MeshLamberMaterial(
{ color:0x0000ff}
)
-
这里面，注意两个细节，第一个是里面是一个对象，第二个是颜色的没有使用字符出
-
-
光源
-
THREE.pointLight(0xffffff)
-
参数是光照强度，
-
-
相机
-
THREE.OrthographicaCamera(-sk,sk ,s,-s,1,1000);
-
这里定义的是拍照窗口的大小
-
-
相机的位置
-
camera.position.set(200,300,200)
-
相机拍照的方向
-
-
周期性渲染
-
通过渲染方法.render()来调用
-
然后借用setInterval对象来渲染
-
渲染频率要合适，建议为每秒30到60
-
可以借用requestAnimationFrame来代替定时器对象
-
这个方法很有意思，首先它会调用一个函数，
-
如果这个方法写在一个函数里面，并且其参数就是该函数
-
那么就会出现不断调用该函数的现象发生
-
-
-
旋转的方法
-
使用mesh.rotateY(0.01)
-
这个方法
-
-
three.js的控件
-
orbitcontrols.js
-
这个用鼠标操控模型的一个控件
-
这里的代码有点意思
-
将渲染的方法写在change事件上，每次鼠标进行改变，都会触发渲染功能
-
也可以使用requestAnimationFrame函数，通过不断刷新来调用
-
该方法为异步方法，它比定时器牛逼的地方在于，渲染时间变短，效果更加好
-
并且不会耽误主进程的使用
-
-
-
关于球面
-
球面其实可以看成一个正多边形
-
只要它的面无限的多就可以创建一个球体
-
-
几何体
- 几何体有很多个，有很多api，用的时候再用
-
添加多个几何体
-
几何体的添加通过scence.add(对应的模型)
-
然后对于几何体的位置
-
使用transltaeY()来进行移动
-
注意与css的动画没有半毛钱关系
-
-
position.set(x,y,z)来进行定位
- 重新定义位置
