使用 three.js 在 FPS 游戏中进行碰撞检测

Question

我最近一直在尝试修复我的第一人称射击游戏 three.js 游戏中的碰撞检测，但还有一些问题我什至对如何修复一无所知...

摄像头可以看到墙内
碰撞经常将玩家推到地图外

我这里有一个 jsfiddle：http://jsfiddle.net/sxv5fwL4/95/

我也收到了关于 post 下的 three.js subreddit 的一些建议...

"Use of the "stemkoski" collision detection?"

提前感谢您的宝贵时间，并感谢 /u/stovenn 在我的 reddit post 中提供的帮助 post。

Answer 1

我想 /u/stovenn 谈到了这个 git http://stemkoski.github.io/Three.js/

根据 stemkoski 中的线程 How to detect collision in three.js? git 是 three.js

中碰撞检测的工作示例

Answer 2

此 jsfiddle0（请参阅更新版本的答案结尾）是所引用版本的黑客版本。地图存在问题，我已通过将其读取为 [u][v] 并映射编辑来解决该问题：（u-->z 和 v-->x）。现在代码中地图的布局和模拟中地图的布局是一样的

我使用了一个非常简单的“(2D) 边界框内的点”碰撞测试。它基于测试玩家在每个动画步骤中建议的新位置是否位于墙立方体的 x 范围和 z 范围内。如果是，那么提议的位置将被拒绝，并且玩家的（存储的）先前位置将被重新设置。

这里是核心代码：-

if (   tile_x_min <= player_pos_x && player_pos_x <= tile_x_max
    && tile_z_min <= player_pos_z && player_pos_z <= tile_z_max )                              
{
collision_flag = true;
player.velocity.x = 0;
player.velocity.z = 0; 
Message = "IN Wall Cell [" + x + "," + z +  "]" +
"(x:" + tile_pos_x + ", z:" + tile_pos_z + ")";                                           
}

我在玩家位置使用了一个小辅助立方体 ("eddie") 并将相机向后移动了一点以使其可见。这对故障排除有很大帮助。

无论如何，如果你愿意，请尝试一下，让我知道进展如何。

Edit(1) jsfiddle1 添加 player/camera 的简单旋转。使用键numpad_7和numpad_9左右旋转。

编辑(2) jsfiddle2 响应同时按下的多个键。 eddie cube 也被隐藏了 eddie.visible = false.

编辑(3) jsfiddle3 添加了独立的相机旋转：上-中-下（使用数字键 2、5、8）。播放器+相机水平旋转是通过数字键 4,6.

Answer 3

我正在使用 Ammo.js, an emscripten port of the great Bullet Physics Library。这是一个专业、开源、合集的检测库。

这是我创建的示例：physics.autodesk.io

可能对某人有用。

使用 three.js 在 FPS 游戏中进行碰撞检测

Collision Detection in FPS Game using three.js

javascript

html

three.js

collision

detection