绘制一百万次的立方体

Question

我需要使用一个尺寸为1x1x1的立方体构建地形，坐标以.txt文件形式提供，并且大约有11M三元组。

问题是，使用我当前的代码，我只能画出大约60k，然后浏览器选项卡被重置，并提示停止无响应的脚本出来，所以我用了太多的内存和时间来生成它们。

这里的代码块我用它来吸引他们：

function generateCubes(data) { 
    var cubeGeometry = new THREE.CubeGeometry(cubeSize, cubeSize, cubeSize); 
    var material = new THREE.MeshLambertMaterial({color: 0x587058}); 
    var mesh = new THREE.Mesh(cubeGeometry, material); 
    var mergedGeo = new THREE.Geometry(); 
    var instance; 
    var line = data[0].split(';'); 
    var translateX = line[0], translateY = line[1], translateZ = line[2]; 
    //var group = new THREE.Object3d(); 
    for(var i = 0; i < 100000; i++) { // should go to data.length 
     line = data[i].split(';'); 
     //instance = mesh.clone(); 
     //instance.position.set(line[0] - translateX, line[2] - translateZ, line[1] - translateY); 
     //group.add(instance); 
     mesh.position.x = Number(line[0]) - translateX; 
     mesh.position.y = Math.round(Number(line[2]) - translateZ); 
     mesh.position.z = Number(line[1]) - translateY; 
     mesh.updateMatrix(); 
     mergedGeo.merge(instance.geometry, instance.matrix); 
    } 
    group = new THREE.Mesh(mergedGeo, material); 
    scene.add(group); 
} 

的功能是从所谓的成功在$就调用。

评论部分使用没有合并的几何，这样我可以绘制大约100k的数据。

谢谢你帮助我。

编辑：我看到this question它并没有帮助我很多。

Answer 1

你在找什么是体素渲染。两个主要的渲染路径来完成这一点：A）体积渲染，但webgl缺乏硬件3d纹理支持。 B）网格曲面生成和标准多边形渲染。可能是唯一的选择。不要认为在公开场合有任何高效的js实现。

你需要做什么。

1. 把你的世界在同一尺寸的大块，大块 尺寸大概需要是2的幂，以允许在他们更快 操作。

2. 想出一个可以存储11M体素数据的数据结构。 这可能需要在Int32Arrays的某些排列中，并使用位明智的运算符来访问/存储每个体素上的数据。

3. 对于每个块，生成表面网格。见link。

4. 对于远离摄像头的组块，想出一些方案，其中 可以生成低LOD网格（可选）。
5. 在前后可见的平截头体中呈现所有块的顺序为 。