Turn geometry into small cubes


Hello community, I want to implement the geometry to be made up of many cubes, like in the picture, but I don’t have any ideas, can you give me some ideas, examples, anything

By doing this - which kinda really boils down just to these 2-3 lines of code.

const position = new Three.Vector3();
const voxelOffset = 0.5;

for (let x = 0; x < 100; x++) {
  for (let y = 0; y < 100; y++) {
    for (let z = 0; z < 100; z++) {

      position.set(x, y, z).multiplyScalar(voxelOffset);

      const pointIsInsideGeometry = /* NOTE Do the raycasting here */
      
      if (pointIsInsideGeometry) {
        const voxel = new Three.Mesh(boxGeometry, boxMaterial);
        voxel.position.copy(position);

        scene.add(voxel);
      }
    }
  }
}

Keep in mind:

  1. Use InstancedMesh if you have more than 10x10x10 grid of cubes.
  2. You kinda absolutely have to use three-mesh-bvh - it requires only 3 lines of code to be added, and makes the raycasting part 1 billion times faster (not really an exaggeration, especially for non-triavial models like the car in the screenshot :sweat_smile:)
  3. This works best for watertight meshes - should work ok also for otherz, provided openings are not too big.
3 Likes

https://gkjohnson.github.io/three-mesh-bvh/example/bundle/raycast.html
From the information you provided, I found the effect I wanted very close, thank you very much

1 Like