简述three.js创建一个简单的3D场景所需基本要素

开篇：通过如下描述，我想对于小白来讲都会立马有一个对three.js的基本印象吧！
基本要素：场景，相机，光源，物体（几何体+材质），渲染器；
1.场景：var scene = new THREE.Scene();

2.相机：相机分为两种，一种是正交投影相机（THREE.OrthographicCamera()）,使用正交相机适合的场景有制图，建模等场景，因为它不受相机距离的影响，也就是相机的距离如何变化，我们的模型都不会变大或者缩小；一种是透视投影相机（THREE.PerspectiveCamera()），使用透视投影相机，要把它想象成人的眼睛，会有近大远小的效果，所以根据这个特性，大部分场景都是适合使用透视投影相机的；
相机的参数含义：正交相机有6个参数THREE.OrthographicCamera(left,right,top,bottom,near,far);正如参数表面的含义一样；它渲染的就是一个设置了左右上下边界的空间，near和far表示相机可以渲染的最近和最远的距离，如果超出了这个范围，我们所要渲染的模型便会消失；透视相机有4个参数，THREE.PerspectiveCamera(fov,aspect,near,far),fov代表的是相机在竖直方向的张角，也可以理解为人眼睛张开的角度，一般设置为45度，这样更符合人类的正常观察视角，aspect代表的是宽高比（通常设置为画布的宽高比），near和far和正交相机的含义一样；

3.光源：光源我就只介绍一下我在项目中用到的光源；
环境光：所有角度看到的亮度一样，通常用来为整个场景指定一个基础的亮度，没有明确光源位置；也就是说，我们渲染的模型不管你是如何的旋转或者翻转，都不会出现阴影，你看到的每一个面都是一样的效果；
点光源：顾名思义，它是一个点发出的光源，它是一个点朝四面八方发射的光源。照到不同物体表面的亮度线性递减，第一次看到这个其实很多人会把它当作手电筒类似的去看，其实不是的，因为使用点光源不能用来创建阴影，当然，在新版本中，点光源也可以创建阴影了；
聚光灯：投射出类似于圆锥型的光线，这个可以类比于我们用的手电筒，它也是可以创建阴影的；
平行光：亮度与光源和模型之间的距离无关，至于平行光的角度和物体所在平面有关，聚光灯也是可以创建阴影的；

4.物体：专业上称为网格对象（THREE.Mesh()），也可以是我们通过第三方导进来的模型，如果网格对象是我们自己去创建，那么我们需要使用THREE.SphereGeometry定义物体的形状(注意，此处我用的是球体，物体的不同形状由不同的实例对象来创建的，具体可以在官网上查)，使用THREE.MeshBasicMaterial定义物体的外观和材质，并将它们合成能够添加到场景中的网格；
示例创建一个球体：
var sphereGeometry = new THREE.SphereGeometry(4,20,20);
var sphereMaterial = new THREE.MeshBasicMaterial({color:0x7777ff});
var sphere = new THREE.Mesh(sphereGeometry ,sphereMaterial );
材质这一块，常用漫反射，镜面反射两种材质，还可以引入外部图片，贴到物体表面，成为纹理贴图；还有，添加材质不止可以添加一种，随心所欲，想添加多少就添加多少；

5.渲染器：
var renderer = new THREE.WebGLRenderer(); //创建渲染器
//创建控件对象 相机对象camera作为参数 控件可以监听鼠标的变化，改变相机对象的属性
var controls = new THREE.OrbitControls(camera, renderer.domElement);
renderer.setSize(width, height); //设置渲染区域尺寸
renderer.setClearColor(0xFFFFFF, 1); //设置背景颜色
document.body.appendChild(renderer.domElement); //body元素中插入canvas对象

// 渲染函数
function render() {
controls.update();
//更新控件对象
renderer.render(scene, camera); //执行渲染操作
requestAnimationFrame(render); //请求再次执行渲染函数render，渲染下一帧
}

总结：通过以上步骤可以简单的了解到创建一个3D场景其实并不难，但其实，上述的每一个对象都有很多的属性，需要去设置实现你想实现的效果，相关属性根据自己的需求在官方文档可以查到。