Three.js绘制边缘

Question

我有三维模型与曲面细分几何(我有顶点和三角形的数组),我还有原始非曲面几何的边缘数组.我找不到任何带有描述的教程/示例如何显示边缘数组和Three.js的文档是不完整的:

//
// Cube geometry
//
//   4+--------+7
//   /|       /|
// 5+--------+6|
//  | |      | |
//  |0+------|-+3
//  |/       |/
// 1+--------+2
//
var cube_vertices = [
    [-1.0, -1.0, -1.0],
    [ 1.0, -1.0, -1.0],
    [ 1.0,  1.0, -1.0],
    [-1.0,  1.0, -1.0],
    [-1.0, -1.0,  1.0],
    [ 1.0, -1.0,  1.0],
    [ 1.0,  1.0,  1.0],
    [-1.0,  1.0,  1.0]
];
var cube_edges = [
    [0, 1],
    [1, 2],
    [2, 3],
    [3, 0],
    [0, 4],
    [1, 5],
    [2, 6],
    [3, 7],
    [4, 5],
    [5, 6],
    [6, 7],
    [7, 0]
];

有人有什么建议吗？谢谢.

---

编辑:发送此问题后,我找到了解决方案.使用时创建线条或折线THREE.Line(geometry, material),则可以使用可选的第三个参数调用type,其中一个类型是THREE.LinePieces,它完全符合我的要求.可以在Line()文档中找到更多信息.您可以使用以下代码创建许多断开的行:

var material = new THREE.LineBasicMaterial({ color: 0x0000ff });
var geometry = new THREE.Geometry();
for(var i = 0; i < cube_edges.length; i++) {
    // Add first vertex of edge
    geometry.vertices.push( new THREE.Vector3(
        cube_vertices[cube_edges[i][0]][0],
        cube_vertices[cube_edges[i][0]][1],
        cube_vertices[cube_edges[i][0]][2]
        )
    );
    // Add second vertex of edge
    geometry.vertices.push( new THREE.Vector3(
        cube_vertices[cube_edges[i][1]][0],
        cube_vertices[cube_edges[i][1]][1],
        cube_vertices[cube_edges[i][1]][2]
        )
    );
}
var line = new THREE.Line( geometry, material, THREE.LinePieces);
scene.add( line );

可能是,它不是最好的解决方案,但它只是有效.:-)

Answer 1

r75:该THREE.LinePieces选项已被替换为THREE.LineSegments.

var eGeometry = new THREE.EdgesGeometry( mesh.geometry );
var eMaterial = new THREE.LineBasicMaterial( { color: 0x00ff000, linewidth: 4 } );
var edges = new THREE.LineSegments( eGeometry , eMaterial );
mesh.add( edges );