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

时间:2016-03-02 13:03:18

标签: javascript html three.js collision detection

我最近一直试图在我的第一人称射击游戏three.js游戏中修复我的碰撞检测但是还有一些问题我对如何解决问题一点都没有想法...

  • 相机可以查看内墙
  • 碰撞会定期将玩家推到地图之外

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

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

"Use of the "stemkoski" collision detection?"

我提前感谢您的时间,感谢/ u / stovenn在我的reddit帖子中提供的帮助。

3 个答案:

答案 0 :(得分:3)

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

根据stemkoski git中的线程How to detect collision in three.js?是一个在three.js中进行碰撞检测的工作示例

答案 1 :(得分:2)

jsfiddle0(请参阅最新版本的答案结尾)是引用版本的黑客版本。通过将其作为[u] [v]读取并映射编辑:(u - > z和v - > x),我解决了Map的问题。现在,代码中的地图布局与模拟中的地图布局相同。

我在边界框中使用了一个非常简单的"(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 + ")";                                           
}   

我在玩家位置使用了一个小帮手立方体(&#34; eddie&#34;)并将相机向后移动一点以使其可见。这有助于解决故障。

无论如何,如果你愿意,试一试,让我知道它是怎么回事。

编辑(1)jsfiddle1添加播放器/相机的简单旋转。使用键numpad_7和numpad_9左右旋转。

编辑(2)jsfiddle2响应同时按下的多个键。此外,使用eddie.visible = false隐藏了eddie多维数据集。

编辑(3)jsfiddle3添加了独立的相机旋转:向上中心向下(使用Numpad键2,5,8)。播放器+相机水平旋转是由Numpad键4,6。

答案 2 :(得分:2)

我正在使用Ammo.js,一个伟大的Bullet Physics Library的emscripten端口。这是一个专业的开源集合检测库。

以下是我创建的示例:physics.autodesk.io

可能对某人有用。