three.js自定义造型示例

 

/
//物体造型关键向量点
var vertices = [
	new THREE.Vector3(-1,0,-1),
	new THREE.Vector3(1,0,-1),
	new THREE.Vector3(1,0,1),
	new THREE.Vector3(-1,0,1),
	new THREE.Vector3(0,2,0)
];
//围合各个向量点形成平面
var faces = [
	new THREE.Face3(0,1,2),
	new THREE.Face3(2,3,0),
	new THREE.Face3(4,3,2),
	new THREE.Face3(1,4,2),
	new THREE.Face3(0,4,1),
	new THREE.Face3(3,4,0)
];
//使用以上点和面创建几何体
var geom = new THREE.Geometry();
geom.vertices = vertices;
geom.faces = faces;
//计算点面法线
geom.computeFaceNormals();
geom.computeVertexNormals();
geom.mergeVertices();
//所有面必须全部设色才能正常显示
for(var i=0;i<geom.faces.length;i++){
	geom.faces[0].color.set(0xffffff);
}
//之后修改某一个面的颜色
geom.faces[0].color.set("red");
geom.faces[1].color.set("orange");
geom.faces[2].color.set("yellow");
geom.faces[3].color.set("green");
geom.faces[4].color.set("blue");
geom.faces[5].color.set("violet");
//设置材质的颜色vertexColors:THREE.FaceColors
var material=new THREE.MeshPhongMaterial({vertexColors:THREE.FaceColors});
var mesh=new THREE.Mesh(geom,material);

mesh.castShadow=true;

mesh.position.x=3;
mesh.position.y=2;
mesh.position.z=3;

scene.add(mesh);