THREE.js中物体相交顶点获取及百万顶点模型球体碰撞检测问询

核心思路：用空间加速结构避免全量遍历 #

百万级顶点的模型，直接遍历每个顶点做距离判断是O(n)复杂度，完全没法实时运行。必须用空间划分结构把模型的顶点/面分组，查询时只检查可能相交的区域，把复杂度降到O(log n)级别。Three.js里最常用的就是Octree和MeshBVH（Bounding Volume Hierarchy）。

1. 预处理静态模型（关键！） #

因为你的大模型是静态的（只有球体在动），所以先一次性把模型的几何体数据导入空间加速结构，后续查询就会非常快：

• 用Octree：Three.js内置了THREE.Octree，可以直接从几何体生成：

  const staticModelOctree = new THREE.Octree();
  // 把静态模型的几何体传入，会自动划分空间
  staticModelOctree.fromGeometry(yourLargeStaticModel.geometry);
  

• 用MeshBVH：如果需要更高的性能（尤其是面级检测），可以用Three.js官方的MeshBVH扩展，它对三角形的相交检测优化得更好，适合高精度场景。

2. 球体移动时的实时检测 #

当球体在场景中移动时，先把球体转换成THREE.Sphere对象（包含球心和半径），然后用加速结构查询相交的元素：

// 构建球体的碰撞体
const ballCollision = new THREE.Sphere(
  ballMesh.position,
  ballMesh.geometry.parameters.radius
);

// 用Octree查询所有和球体相交的三角形/顶点
const intersections = staticModelOctree.intersectSphere(ballCollision);

3. 获取精确的相交顶点/首个接触点 #

如果要找相交的顶点：可以在预处理时把模型的顶点单独加入Octree（或者直接从相交的三角形中提取顶点），然后计算这些顶点到球心的距离，找到距离≤球半径且最近的那个顶点，就是相交顶点。

如果要找精确的接触点（不一定是顶点）：对每个相交的三角形，用THREE.Triangle.closestPointToPoint()计算三角形到球心的最近点，判断这个点到球心的距离是否≤球半径，取距离最小的那个点就是首个接触点：

let closestContactPoint = null;
let minDistance = Infinity;

if (intersections.length > 0) {
  intersections.forEach(item => {
    // 从相交结果中取出三角形的三个顶点
    const triangle = new THREE.Triangle(item.a, item.b, item.c);
    // 计算三角形到球心的最近点
    const tempPoint = new THREE.Vector3();
    const closestOnTriangle = triangle.closestPointToPoint(ballCollision.center, tempPoint);
    // 计算这个点到球心的距离
    const distance = ballCollision.center.distanceTo(closestOnTriangle);
    
    // 筛选出在球体内且距离最近的点
    if (distance <= ballCollision.radius && distance < minDistance) {
      minDistance = distance;
      closestContactPoint = closestOnTriangle.clone();
    }
  });

  if (closestContactPoint) {
    console.log("首个接触点坐标：", closestContactPoint.x, closestContactPoint.y, closestContactPoint.z);
  }
}

性能对比&注意事项 #

• 直接遍历顶点：绝对不要用在百万级模型上，帧率会直接掉到个位数。
• Octree vs MeshBVH：Octree内置在Three.js里，上手简单；MeshBVH性能更高，但需要额外引入扩展，适合对精度和速度要求极高的场景。
• 动态模型的情况：如果你的大模型是动态的（比如会变形），那需要实时更新加速结构，性能会有所下降，但静态模型的场景下完全不用担心。

内容的提问来源于stack exchange，提问作者Detuned