学习Three.js——网格(Mesh)

网格

几何体是不能被渲染的，只有几何体和材质结合成网格才能被渲染到屏幕上

常见属性和方法

position:表示网格的绝对位置

设置position的方法有3个：

1. mesh.position.x = x;mesh.position.y=y;mesh.position.z=z
2. mesh.position.set(x,y,z)
3. mesh.position = new THREE.Vector3(x,y,z)

rotation:表示物体绕x,y,z轴旋转的弧度(注意是弧度不是角度)

设置rotation的方法和position类似：

1. mesh.rotation.x = x;mesh.rotation.y=y;mesh.rotation.z=z
2. mesh.rotation.set(x,y,z)
3. mesh.rotation = new THREE.Vector3(x,y,z)

scale表示物体在x,y,z轴缩放的大小，设置方法和上面的类似

translate:物体相对于原来的位置在x,y,z轴移动的距离

设置translate的方法：

1. mesh.translate(x,y,z)
2. mesh.translateX(x);mesh.trainslateY(y);mesh.translateZ(z)

visible:若设置为false，那么将不会被渲染

创建具有多种材质的网格

首先，先定义多个材质

var materials = [
    new THREE.MeshLambertMaterial({opacity:0.6,color:0x44ff44,transparent:true}),
    new THREE.MeshBasicMaterial({color:0xffffff,wireframe:true})
];

然后使用THREE.SceneUtils.createMultiMaterialObject()方法创建网格

var mesh = THREE.SceneUtils.createMultiMaterialObject(geom,materials);

注意，这个网格实质上是一个网格组，组内的子元素(网格)都是相互独立的，要对所有子元素使用某个方法，可以使用

mesh.children.forEach(function (e) {
    ...
});

网格组和合并

组合

创建一个组对象(Group)，使用add()方法将网格加入到组。注意，对单个对象的位置，放缩等处理都是相对于组的父对象的。

var group - new THREE.Object3D();//或者new THREE.Group()
group.add(sphere);
group.add(cube);
scene.add(group);

合并

使用merge()方法，将几何体合并，合并后的几何体看作是一个几何体。

geometry1.merge(geometry2,geometry.matrix)