Multiple geometries are not showing

Hello everybody,

I have a problem. I create multiple rectangles and multiple spheres and group them together to export to other platform but for some reasons only one rectangle and one sphere is shown. Any help is greatly appreciated. Thanks in advance.

const geometry = new THREE.BoxGeometry(1,1,6);
for (var i = 0;i<50;i++){
  var mesh = new THREE.Mesh( geometry, material);
  mesh.position.x = ( Math.random() - 0.5) * 120;
  mesh.position.y = ( Math.random() - 0.5) * 10;
  mesh.position.z = ( Math.random() - 0.5) * 50;

  mesh.rotation.y = Math.random();
  mesh.scale.setScalar( THREE.MathUtils.lerp( 1.5, 3, Math.random() ) );
}

const geometry2 = new THREE.SphereGeometry(1,1,6);
for (var i = 0;i<50;i++){
  var mesh1 = new THREE.Mesh( geometry2, material);
  mesh1.position.x = ( Math.random() - 0.5) * 120;
  mesh1.position.y = ( Math.random() - 0.5) * 10;
  mesh1.position.z = ( Math.random() - 0.5) * 50;

  mesh1.rotation.x = Math.random();
  mesh1.scale.setScalar( THREE.MathUtils.lerp( 1.5, 3, Math.random() ) );
}

mesh.updateMatrix();
mesh1.updateMatrix();

const group = new THREE.Group();
group.add(mesh);
group.add(mesh1)
scene.add(group)

try this

const group = new THREE.Group();
const geometry = new THREE.BoxGeometry(1, 1, 6);
for (let i = 0; i < 50; i++) {
  const mesh = new THREE.Mesh(geometry, material);  
  mesh.position.x = (Math.random() - 0.5) * 120;
  mesh.position.y = (Math.random() - 0.5) * 10;
  mesh.position.z = (Math.random() - 0.5) * 50;  
  mesh.rotation.y = Math.random();
  mesh.scale.setScalar(THREE.MathUtils.lerp(1.5, 3, Math.random()));  
  group.add(mesh);  
}

const geometry2 = new THREE.SphereGeometry(1, 1, 6);
for (let i = 0; i < 50; i++) {
  const mesh1 = new THREE.Mesh(geometry2, material);  
  mesh1.position.x = (Math.random() - 0.5) * 120;
  mesh1.position.y = (Math.random() - 0.5) * 10;
  mesh1.position.z = (Math.random() - 0.5) * 50;
  mesh1.rotation.x = Math.random();
  mesh1.scale.setScalar(THREE.MathUtils.lerp(1.5, 3, Math.random()));  
  group.add(mesh1)
}

scene.add(group)

Example : https://jsfiddle.net/seanwasere/584dzxk1/

Also, your lerps aren’t doing anything useful. I am not sure what they are meant to do from the code you posted.

1 Like

Thank you so much for your help.