three.js 中顶点的表面覆盖

Question

我正在为 3D 数据点创建表面可视化。我可以用球体在空间中绘制数据点。现在我想创建一个表面覆盖。这是它的jsfiddle：

https://jsfiddle.net/dnprock/b9xyfno5/10/

我尝试了三角测量，但它没有生成我想要的表面：

triangles = THREE.Shape.Utils.triangulateShape(顶点、孔);

for( var i = 0; i < triangles.length; i++ ){
    geometry.faces.push( new THREE.Face3( triangles[i][0], triangles[i][1], triangles[i][2] ));
}

生成覆盖点的表面的方法是什么？

Answer 1

face3 采用 geometry.vertices 中已经存在的三个顶点的索引 并制作一个面。在这里，您似乎正在尝试使用原始顶点坐标制作面，而不将它们包含在网格的几何形状中。 假设 triangles[i] 是三个 Vector3 对象的数组：

for( var i = 0; i < triangles.length; i++ ){
    var first_vertex_index= geometry.vertices.push(triangles[i][0])
    var second_vertex_index= geometry.vertices.push(triangles[i][1])
    var third_vertex_index= geometry.vertices.push(triangles[i][2]) 
    geometry.faces.push( new THREE.Face3( first_vertex_index, second_vertex_index, third_vertex_index ));
}

如你所知，push 方法返回的是被推送对象在数组中的索引，我们把索引放在 Face3 中而不是坐标。