Question

我正在Three.js中测试一些编码技术，我对此有基本的了解，但是在尝试进行项目时遇到了一个问题。我试图弄清楚如何在第一人称视角中检测到碰撞（按键会移动相机）。

我有一个玩家变量，定义为：

var player = { height:1.8, speed:0.1, turnSpeed:Math.PI*0.01 };

和按键事件中的移动为：

if(keyboard[87]){ // W key
    camera.position.x -= Math.sin(camera.rotation.y) * player.speed;
    camera.position.z -= -Math.cos(camera.rotation.y) * player.speed;
}
if(keyboard[83]){ // S key
    camera.position.x += Math.sin(camera.rotation.y) * player.speed;
    camera.position.z += -Math.cos(camera.rotation.y) * player.speed;
}
if(keyboard[65]){ // A key
    // Redirect motion by 90 degrees
    camera.position.x += Math.sin(camera.rotation.y + Math.PI/2) * player.speed;
    camera.position.z += -Math.cos(camera.rotation.y + Math.PI/2) * player.speed;
}
if(keyboard[68]){ // D key
    camera.position.x += Math.sin(camera.rotation.y - Math.PI/2) * player.speed;
    camera.position.z += -Math.cos(camera.rotation.y - Math.PI/2) * player.speed;
}

然后我就这样加载了一个板条箱（已加载纹理，凹凸和法线贴图）：

crate = new THREE.Mesh(
    new THREE.BoxGeometry(3,3,3),
    new THREE.MeshPhongMaterial({
       color: 0xffffff,
       map: crateTexture,
       bumpMap: crateBumpMap,
       normalMap: crateNormalMap,           
        })
);

程序中的所有内容都可以正常工作，我只想知道如何检测相机与墙壁的碰撞。我不想去设置像这样的参数：

if(keyboard[68] && !(camera.position.x < crate.position.x + 1.5) && !(camera.position.x > crate.position.x - 1.5) && !(camera.position.z < crate.position.z -1.5) && !(camera.position.z > crate.position.z -1.5)) { // D key
    camera.position.x += Math.sin(camera.rotation.y - Math.PI/2) * player.speed;
    camera.position.z += -Math.cos(camera.rotation.y - Math.PI/2) * player.speed;
}

有人可以给我一种检测诸如板条箱（boxGeometry）之类的物体与其他形状之间的碰撞的方法吗？

编辑：我相信我找到了一种手动检测与相机和boxGeometry碰撞的方法，但是到目前为止，仅在一个面上并且一个方向移动即可。下面的这段代码在向前移动时会在加载时检测到右脸。

if(camera.position.z > crate.position.z - 1.650 && camera.position.z < 
crate.position.z + 1.650 && camera.position.x > crate.position.x - 2 && 
camera.position.x < crate.position.x - 1.9 && camera.rotation.y > - Math.PI && camera.rotation.y < 0 ) canMoveForward = false;
if(!(camera.position.z > crate.position.z - 1.650 && camera.position.z < 
crate.position.z + 1.650 && camera.position.x > crate.position.x - 2 && 
camera.position.x < crate.position.x - 1.9 && camera.rotation.y > - Math.PI && camera.rotation.y < 0 )) canMoveForward = true;

然后，我在按键事件中实现了检测系统，该系统允许执行“墙壁滑行”机制，如果我以一定角度向前行走，它将使我无法进入板条箱，但会根据自己的旋转而移动。这是代码：

if(keyboard[87] ){ // W key
   if(camera.position.z > crate.position.z - 1.650 && camera.position.z < crate.position.z + 1.650 && camera.position.x > crate.position.x - 2 && camera.position.x < crate.position.x - 1.9 && camera.rotation.y > - Math.PI && camera.rotation.y < 0 ) {
    camera.position.z -= -Math.cos(camera.rotation.y) * player.speed;
    } else if(canMoveForward == true) {
    camera.position.x -= Math.sin(camera.rotation.y) * player.speed;
    camera.position.z -= -Math.cos(camera.rotation.y) * player.speed;
}
}

我认为经过测试，我可能会找到一些更容易/更通用的方法来实现if语句来检测此冲突。但是随之而来的问题是，我走的是哪种方式，这也成为一个问题。我已绘制出地图，必须在输入碰撞的那一侧检查多少旋转。

如果能找到一种更容易/更简单的方法来检测这种类型的碰撞，我将不胜感激。到目前为止，这是我的project，以便您可以进一步了解这种情况。

Answer 1

How to detect collision in three.js?

如果您转到链接，则该问题已关闭，但它们仍涵盖3d碰撞的一般概念。

碰撞检测three.js /相机碰撞

1 个答案: