Three.js博物馆场景相机碰撞检测失效问题求助

你遇到的碰撞检测不生效问题，主要有两个核心原因，我帮你拆解并给出修正方案：

1. 错误的碰撞判断逻辑 #

你当前用相机位置到plane_8中心的距离来判断碰撞，但plane_8是一个立方体（CubeGeometry(60,1024,2048)），它的实际碰撞边界是立方体的实体范围，而不是到中心的距离。

举个实际例子：plane_8的x位置是+2048，立方体x方向的半宽是60/2=30，所以相机的x坐标如果超过2048 + 30 = 2078，就已经穿入墙体了。但你设置的d < 200阈值远大于立方体的实际宽度，导致相机已经进到墙里都不会触发碰撞逻辑。

2. 错误的位置/旋转赋值方式 #

在Three.js中，camera.position和camera.rotation都是对象类型，直接用=赋值只是让变量指向同一个对象引用，不会真正重置相机的位置和旋转状态。必须使用.copy()方法来复制对象的具体数值。

修正后的代码 #

把你原来的碰撞检测代码替换成下面的逻辑，同时修复赋值问题：

// 替换原碰撞检测代码
// 方式1：手动计算立方体边界（适合固定尺寸的物体）
const plane8HalfX = 60 / 2; // CubeGeometry的x尺寸是60，半宽30
const plane8MaxX = plane_8.position.x + plane8HalfX;

// 检测相机是否穿入plane_8的x方向墙体（因为这是垂直x轴的墙）
if (camera.position.x > plane8MaxX) {
    // 正确重置位置和旋转
    camera.position.copy(previousPosition);
    camera.rotation.copy(previousRotation);
}

如果需要更严谨的全包围碰撞检测（同时判断y、z方向），可以扩展逻辑：

const plane8HalfY = 1024 / 2;
const plane8HalfZ = 2048 / 2;
const plane8MinX = plane_8.position.x - plane8HalfX;
const plane8MaxX = plane_8.position.x + plane8HalfX;
const plane8MinY = plane_8.position.y - plane8HalfY;
const plane8MaxY = plane_8.position.y + plane8HalfY;
const plane8MinZ = plane_8.position.z - plane8HalfZ;
const plane8MaxZ = plane_8.position.z + plane8HalfZ;

// 检测相机是否进入立方体的实体范围
if (camera.position.x > plane8MinX && camera.position.x < plane8MaxX &&
    camera.position.y > plane8MinY && camera.position.y < plane8MaxY &&
    camera.position.z > plane8MinZ && camera.position.z < plane8MaxZ) {
    camera.position.copy(previousPosition);
    camera.rotation.copy(previousRotation);
}

额外优化建议 #

• 可以使用Three.js内置的THREE.Box3自动计算物体包围盒，不用手动算半尺寸，更灵活：

  const plane8Box = new THREE.Box3().setFromObject(plane_8);
  if (plane8Box.containsPoint(camera.position)) {
      camera.position.copy(previousPosition);
      camera.rotation.copy(previousRotation);
  }
  

  这种方式会自动适配物体的尺寸、旋转和位置变化，后期修改场景时不用再手动调整边界数值。

• 你当前在相机移动前克隆previousPosition和previousRotation的时机是对的，确保碰撞时能准确回到移动前的状态。

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