每个面有 K 个顶点的 3D 点的三角剖分

Question

我正在使用 Three.js。我有一组 3D 点 (x, y, z) 和一组面孔。一张脸由 K 个点 组成。它可以是凸的也可以是凹的。 我在 Three.js 文档中找不到任何可以帮助我的东西。一种解决方案是对这些形状进行三角剖分，但到目前为止我还没有找到任何简单的 3D 三角剖分算法。

另一种解决方案是这样做：

var pointsGeometry = new THREE.Geometry();

pointsGeometry.vertices.push(new THREE.Vector3(10, 0, 0));
pointsGeometry.vertices.push(new THREE.Vector3(10, 10, 0));
pointsGeometry.vertices.push(new THREE.Vector3(0, 10, 0));
pointsGeometry.vertices.push(new THREE.Vector3(1, 3, 0));
pointsGeometry.vertices.push(new THREE.Vector3(-1, 3, 0));
pointsGeometry.vertices.push(new THREE.Vector3(10, 0, 0));

var material = new THREE.MeshBasicMaterial({color: 0x00ff00});

var mesh = new THREE.Shape/ShapeGeometry/Something(pointsGeometry, material);
group.add(mesh);

scene.add(group);

我有很多这样的形状，它们组成了一个封闭的表面。

有什么建议吗？

感谢您的关注。 祝你有美好的一天。

Answer 1

正如您所指出的，有两种方法可以实现：

• 使用 3D 三角测量算法（Three.js 未提供）；
• 使用通常用于 Three.js Shape 对象的 2D 三角测量算法，并对几何体的每个面应用一些变换。

最后一个看起来很酷，但不幸的是，当我尝试时，我意识到这并不是那么微不足道。我想出了类似于 Paul-Jan 所说的话：

对于几何图形的每个面：

1. 计算人脸的质心；
2. 计算人脸法线；
3. 计算人脸矩阵；
4. 将 3D 点投影到人脸的 2D 平面上；
5. 创建几何体（使用Shape 三角剖分算法进行三角剖分）；
6. 将面矩阵应用于新创建的几何体
7. 创建一个Mesh 并将其添加到Object3D（我尝试将所有几何图形合并为1，但使用ShapeBufferGeometry 失败）

检查this fiddle。

注意顶点的winding order 或将THREE.Material.side 放到THREE.DoubleSide 以防止面被剔除。

Answer 2

我认为您可能想重新访问 Three.js 文档，尤其是 Shape 对象。该页面上的示例代码使用bezierCurveTo，但如果您改用lineTo，您可以将点序列输入它并创建凹多边形（包括孔）。