Javascript Three.js问题中的几何体、材质和网格
目前正在使用Three.js 我所拥有的: 如下图和代码所示,我有一个for循环,可以在场景中的任意位置创建特定对象 图: 代码:Javascript Three.js问题中的几何体、材质和网格,javascript,three.js,geometry,mesh,Javascript,Three.js,Geometry,Mesh,目前正在使用Three.js 我所拥有的: 如下图和代码所示,我有一个for循环,可以在场景中的任意位置创建特定对象 图: 代码: //创建对象 var几何=新的三个。CylinderBufferGeometry(0、10、30、4、1); var material=new THREE.MeshPhongMaterial({color:0xffffff,flatShading:true}); 对于(var i=0;i你真的可以做任何你想做的事。你只需要填充你的materialList[] 单程
//创建对象
var几何=新的三个。CylinderBufferGeometry(0、10、30、4、1);
var material=new THREE.MeshPhongMaterial({color:0xffffff,flatShading:true});
对于(var i=0;i你真的可以做任何你想做的事。你只需要填充你的materialList[]
单程
for(var i=0;ivar materialList=[];
对于(var i=0;i检查THREE.js的文档和示例以了解支持的材质,有简单材质、特定于照明的材质(如Phong)等..搜索周围谢谢我会查看它对对象着色的效果非常好。谢谢@gaitat
//Create Objects
var geometry = new THREE.CylinderBufferGeometry( 0, 10, 30, 4, 1 );
var material = new THREE.MeshPhongMaterial( { color: 0xffffff, flatShading: true } );
for(var i=0; i<100; i++) {
var mesh = new THREE.Mesh( geometry, material );
mesh.position.x = getRandomInt(-500,500);
mesh.position.y = getRandomInt(10, 100);
mesh.position.z = getRandomInt(-500,500);
mesh.updateMatrix();
mesh.matrixAutoUpdate = false;
scene_Main.add( mesh );
}
var geometryList = [cube, pyramid, sphere, donut, ...];
var materialList = [ .. what posibilities I have here? .. ];
for(var i=0; i<100; i++) {
var mesh = new THREE.Mesh( geometryList[random[n]], materialList[random[n]] );
....
}
for(var i=0; i<100; i++) {
color = new THREE.Color( 0xffffff );
color.setHex( Math.random() * 0xffffff );
materialList.push(new THREE.MeshBasicMaterial({ color: color }));
}
var materialList = [];
for(var i=0; i<150; i++) {
//Prepare different material for each object
var color = new THREE.Color( 0xffffff );
color.setHex( Math.random() * 0xffffff );
materialList.push(new THREE.MeshBasicMaterial({ color: color }));
//Prepare diferent sizes for the objects
var geometrySize_2 = getRandomInt(5,30);
//Create 50 Pyramids
if(i <= 50){
var geometry1 = new THREE.CylinderBufferGeometry( 0, 10, 30, 4, 1 );
var mesh = new THREE.Mesh( geometry1, materialList[i] );
mesh.position.x = getRandomInt(-500,500);
mesh.position.y = getRandomInt(10, 150);
mesh.position.z = getRandomInt(-500,500);
mesh.updateMatrix();
mesh.matrixAutoUpdate = false;
scene_Main.add( mesh );
}
//Create 50 Cubes
else if(i <= 100 && i>= 50){
var geometry2 = new THREE.BoxGeometry(geometrySize_2,geometrySize_2,geometrySize_2);
var mesh = new THREE.Mesh( geometry2, materialList[i] );
mesh.position.x = getRandomInt(-500,500);
mesh.position.y = getRandomInt(10, 150);
mesh.position.z = getRandomInt(-500,500);
mesh.updateMatrix();
mesh.matrixAutoUpdate = false;
scene_Main.add( mesh );
}
//Create 100 Spheres
else if(i <= 150 && i>= 50){
var geometry3 = new THREE.SphereGeometry( 5, 32, 32 );
var mesh = new THREE.Mesh( geometry3, materialList[i] );
mesh.position.x = getRandomInt(-500,500);
mesh.position.y = getRandomInt(10, 150);
mesh.position.z = getRandomInt(-500,500);
mesh.updateMatrix();
mesh.matrixAutoUpdate = false;
scene_Main.add( mesh );
}
}