上文 ，给大家介绍了一下开源WebGL框架three.js的一些基本用法。今天主要给大家介绍一下Mesh和Object3D中的一些常用功能。
var geometry = new THREE.BoxGeometry(50, 100, 20);
var material = new THREE.MeshBasicMaterial({color: 0xff0000});
var mesh = new THREE.Mesh(geometry, material);
scene.add(mesh);
Mesh，简单来说就是3D场景中的物体，它继承自Object3D类，它由两个基本的组成部分：图形（Geometry）和材质（Material）或纹理。
图形 Geometry
三维空间中的几何体，立方体，球体等，能够存储顶点（vertex），位置（positions），面（faces），颜色（colors）等信息。
BoxGeometry： 立方体CylinderGeometry：圆柱体SphereGeometry：球体TorusGeometry：圆环其它材质 Material
抽象低聚背景，几何三角形
物体的旋转 Rotation
mesh.rotation.x = Math.PI / 2;//以X轴为轴旋转90°
mesh.rotation.y = Math.PI / 2;//以Y轴为轴旋转90°
mesh.rotation.z = Math.PI / 2;//以Z轴为轴旋转90°
移动 Translate
mesh.translateX(100);//沿X轴移动100.（向右移动）
mesh.translateY(100);//沿Y轴移动100.（向上移动）
mesh.translateZ(100);//沿Z轴移动100.（向屏幕外移动）
Geometry和BufferGeometry
Geometry 生成的模型是这样的 （代码）-> (CUP 进行数据处理，转化成虚拟3D数据) -> (GPU 进行数据组装，转化成像素点，准备渲染) -> 显示器。第二次操作时重复走这些流程。BufferGeometry 生成模型流程 (代码) -> (CUP 进行数据处理，转化成虚拟3D数据) -> (GPU 进行数据组装，转化成像素点，准备渲染) -> (丢入缓存区) -> 显示器 第二次修改时，通过API直接修改缓存区数据，流程就变成了这样 (代码) -> (CUP 进行数据处理，转化成虚拟3D数据) -> (修改缓存区数据) -> 显示器。这样就节约了GPU性能的运算性能。通常情况下使用vertices属性来初始化Geometry的点。geometry.vertices.push(
new THREE.Vector3( -10, 10, 0 ),
new THREE.Vector3( -10, -10, 0 ),
new THREE.Vector3( 10, -10, 0 )
);
Geometry和BufferGeometry的转换
var geometry = new THREE.Geometry().fromBufferGeometry(bufferGeometry);
BBox of Geometry Geometry.boundingBox通常需要先调用Geometry.computeBoundingBox()方法来生成。BufferGeometry的BBox可以通过转成Geometry然后从Geometry中取得。
ExtrudeGeometry和ExtrudeBufferGeometry
这两个Geometry主要用于对普通的形状（通常是2D的）进行拉伸，使用方法很合其它类似。但需要先了解Shape和ShapePath。 ExtrudeGeometry继承自Geometry。 ExtrudeBufferGeometry继承自BufferGeometry。
小结
在2D的世界里，一个点由x和y两个参数确定，而3D的世界里，一个点是由x，y和z三个参数来确定的，这就是Vector3。当然了，有了点之后，我们就可以在3D的世界里任意创造想要的图形。
在3D的世界里翱翔岂非一朝一夕？多看多练