THREE.Geometry, faces, merge - please help

Questions
1 
generateMesh(octree)
{

    let mergedGeometry = new Geometry();
    const material = this.material;

    for (const leaf of octree.leaves())
    {
        if (leaf.points !== null)
        {
            const pos = new Vector3();
            var i;
            let min = { x: leaf.points[0].x, y: leaf.points[0].y, z: leaf.points[0].z };
            let max = { x: leaf.points[0].x, y: leaf.points[0].y, z: leaf.points[0].z };

            for (i = 0; i < leaf.points.length; i++)
            {
                const point = leaf.points[i];
                pos.add(point);
                min.x = Math.min(min.x, point.x);
                min.y = Math.min(min.y, point.y);
                min.z = Math.min(min.z, point.z);
                max.x = Math.max(max.x, point.x);
                max.y = Math.max(max.y, point.y);
                max.z = Math.max(max.z, point.z);
            }

            let width = Math.round((this.voxelSize + (max.x - min.x)) * 100) / 100;;
            let height = Math.round((this.voxelSize + (max.y - min.y)) * 100) / 100;;
            let depth = Math.round((this.voxelSize + (max.z - min.z)) * 100) / 100;

            let voxelGeometry = new BoxGeometry(width, height, depth);
            pos.divideScalar(i);

            const rgb = leaf.data[0].color;
            if (rgb != null)
            {
                const color = new Color().setRGB(rgb.r / 255, rgb.g / 255, rgb.b / 255);

                for (var i = 0; i < voxelGeometry.faces.length; i++)
                {
                    let face = voxelGeometry.faces[i];
                    face.color.set(color);
                }
            }
            voxelGeometry.translate(pos.x, pos.y, pos.z);
            mergedGeometry.merge(voxelGeometry);
            voxelGeometry.translate(-pos.x, -pos.y, -pos.z);
        }
    }

    let bufGeometry = new BufferGeometry().fromGeometry(mergedGeometry);
    bufGeometry.computeFaceNormals();
    bufGeometry.computeVertexNormals();

    var voxels = new Mesh(bufGeometry, material);

    return voxels;
}

Please help and rewrite this section of code for version 0.140.0 or >

2

Function and over code: three-voxel-loader/VoxelLoader.js at fb08146d23cabea9b1d177a0c8baaac834d58b8e · andstor/three-voxel-loader · GitHub

3

I have not tested the code but it’s something like:

generateMesh(octree) {

  const geometries = [];
  const material = this.material;

  for (const leaf of octree.leaves()) {
    if (leaf.points !== null) {
      const pos = new Vector3();
      const min = {
        x: leaf.points[0].x,
        y: leaf.points[0].y,
        z: leaf.points[0].z
      };
      const max = {
        x: leaf.points[0].x,
        y: leaf.points[0].y,
        z: leaf.points[0].z
      };

      for (let i = 0; i < leaf.points.length; i++) {
        const point = leaf.points[i];
        pos.add(point);
        min.x = Math.min(min.x, point.x);
        min.y = Math.min(min.y, point.y);
        min.z = Math.min(min.z, point.z);
        max.x = Math.max(max.x, point.x);
        max.y = Math.max(max.y, point.y);
        max.z = Math.max(max.z, point.z);
      }

      const width = Math.round((this.voxelSize + (max.x - min.x)) * 100) / 100;
      const height = Math.round((this.voxelSize + (max.y - min.y)) * 100) / 100;
      const depth = Math.round((this.voxelSize + (max.z - min.z)) * 100) / 100;

      const voxelGeometry = new BoxGeometry(width, height, depth);
      pos.divideScalar(i);

      const rgb = leaf.data[0].color;
      const color = new Color()

      if (rgb !== null) {
        color.setRGB(rgb.r / 255, rgb.g / 255, rgb.b / 255);
      } else {
        color.setRGB(1, 1, 1);
      }
      
      const positionAttribute = voxelGeometry.getAttribute('color');
      const colors = [];

      for (let i = 0; i < positionAttribute.count; i++) {
        colors.push(color.r, color.g, color.b);
      }

      voxelGeometry.setAttribute('color', new Float32BufferAttribute(colors, 3));

      voxelGeometry.translate(pos.x, pos.y, pos.z);
      geometries.push(voxelGeometry);
    }
  }

  const geometry = BufferGeometryUtils.mergeBufferGeometries(geometries);
  geometry.computeVertexNormals();

  var voxels = new Mesh(geometry, material);

  return voxels;
}

webgl_geometry_minecraft is a good example that shows how to merge different transformed plane geometries into a single one.

4

THREE.BufferGeometry.computeBoundingSphere(): Computed radius is NaN. The “position” attribute is likely to have NaN values.

Edit: my stupid error

5

Please demonstrate what you do with a complete live example: Edit fiddle - JSFiddle - Code Playground

6

Everything works, thanks a lot