three.js - 将多个线几何组合成单个几何

Question

我对 Three.js 完全陌生，我正在尝试为实体模型添加边缘。

问题是，如果我单独添加边缘，渲染会变慢。所以考虑将几何图形组合成一个单一的，以便渲染速度加快一点。

我遇到了这个:https://github.com/mrdoob/three.js/issues/1370
但是使用上述技术后，输出并不保持正确。

到目前为止我的代码如下:

/* Edge Data */
var vertices = edgeData.vertices;
var edges = edgeData.edges;

// Final Geometry
var combinedGeo = new THREE.Geometry();

/* Add lines */
for( var i=0; i<edges.length; i++){
    var geom = new THREE.Geometry();
    for (var j=0; j<edges[i].length; j++){
        var v1 = vertices[edges[i][j]];
        geom.vertices.push(new THREE.Vector3(v1[0], v1[1], v1[2]));
    }

    // var line = new THREE.Line(geom, material, THREE.LinePieces);
    THREE.GeometryUtils.merge( combinedGeo, geom);
    // scene.add(line);
}
var edgesGeo = new THREE.Line(combinedGeo, material, THREE.LineStrip);
scene.add(edgesGeo);

Answer 1

不需要合并。将点对添加到您的 geometry首先，然后创建一个 Line与 LinePieces环境。见 THREE.AxisHelper代码，例如。