如何用three.js在不同的方向移动多个网格？

Question

我遇到问题。用for循环创建了100个网格。他们都拥有0,0,0的位置。但我希望这100个网格在所有不同的方向上分离。

这是我的代码来创建100目

for(var i = 0; i < 100; i++) 
{ 
var geometry = new THREE.BoxGeometry(2, 2, 2); 
var material = new THREE.MeshBasicMaterial({ color: 0x2194ce}); 
mesh = new THREE.Mesh(geometry, material); 

mesh.position.x = 0; 
mesh.position.y = 0; 
mesh.position.z = 0;  
scene.add(mesh);  
} 

这是代码我怎么虽然移动100个网格，但它只能移动一个网

function render(){ 
     requestAnimationFrame(render); 
      mesh.position.x +=0.1; 
      renderer.render(scene, camera); 

     } 

Answer 1

你只有有最后一个网格在您的mesh 变量中。为了全部移动，可以将它们存储在一个数组中，然后在渲染循环中迭代该数组并分配New Position。 mesh.position.z = 0; meshes.push(mesh);

而在渲染：

for(var i=0; i<meshes.length; i++){ 
     meshes[i].position.x += 0.1; 
} 

我没有测试这一点。