Three.js 中合并几何顶点：如何提取顶点坐标？

javascript

2024-03-19 16:57:33

在 Three.js 中合并几何顶点

介绍

在 Three.js 中，CSG.subtract() 操作可以从一个网格中减去另一个网格，从而创建一个新的网格。この記事将探讨如何提取结果网格中的顶点坐标。

步骤

创建顶点数组

首先，创建一个空数组来存储顶点坐标。

遍历面

遍历结果网格（resultCSG）的 geometry.faces 数组，每个面包含三个顶点索引。

获取顶点位置

对于每个顶点索引，使用 resultCSG.geometry.vertices[index] 获取顶点位置。

存储坐标

将获取的顶点位置添加到顶点数组中。

代码示例

const vertices = [];

// 遍历面
for (let i = 0; i < resultCSG.geometry.faces.length; i++) {
  // 获取三个顶点索引
  const face = resultCSG.geometry.faces[i];
  const indices = [face.a, face.b, face.c];

  // 遍历顶点索引
  for (let j = 0; j < indices.length; j++) {
    // 获取顶点位置
    const vertex = resultCSG.geometry.vertices[indices[j]];

    // 添加到顶点数组
    vertices.push(vertex.x, vertex.y, vertex.z);
  }
}

库版本

本示例代码适用于 Three.js r139 版本。请确保你使用的是正确的库版本。

注意事项

resultCSG 网格可能包含三角形和四边形面。因此，顶点数组中的每个顶点坐标是一个三维数组，包括 x、y 和 z 坐标。
如果要获取顶点索引，请使用 resultCSG.geometry.faces[i].a、resultCSG.geometry.faces[i].b 和 resultCSG.geometry.faces[i].c。