在testCollision函数后查找矩形的哪一侧碰撞

时间:2016-03-31 07:13:53

标签: javascript html5-canvas game-physics

我目前有两个对象bulletList和enemyList,每个对象都包含画布上X和Y位置的属性。我想要编程的是找到子弹碰撞敌人的那一侧。 if语句在testCollision函数

之后运行

到目前为止,我已创建了这个:

if(bulletLocationY < enemyLocationY)

    console.log("Above");

if(bulletLocationY > enemyLocationY)

    console.log("Below");


if(bulletLocationX < enemyLocationX)
    console.log("Left");


if(bulletLocationX > enemyLocationX)
  console.log("Right");

游戏的当前示例:https://jsfiddle.net/pktxmc3y/

有效地我想要做的是当子弹击中左侧的红色敌人时,敌人向右移动,反之亦然。当我从上方击中敌人时,它向下移动,反之亦然。我发现困难的一点是识别子弹击中矩形的那一面。

编辑:只是为了添加正确的答案我还成功使用:

if(bulletLocationY - (bulletHeight/2) < enemyLocationY  - (enemyHeight/2))

    console.log("Above");

if(bulletLocationY + (bulletHeight/2) > enemyLocationY + (enemyHeight/2))

    console.log("Below");


if(bulletLocationX - (bulletWidth/2)< enemyLocationX - (enemyWidth/2))
    console.log("Left");


if(bulletLocationX + (bulletWidth/2)> enemyLocationX + (enemyWidth/2))
  console.log("Right");

1 个答案:

答案 0 :(得分:3)

你无法知道子弹从当前位置发出的位置。现在子弹在敌人的内部,例如,如果它在左上方,它也可能来自左侧或顶部。

所以你需要存储子弹的先前位置。

取决于&#39;象限&#39;那个旧职位在哪里,那么你就可以决定你应该做什么了。

我做了一个小图解释:

enter image description here

如果子弹先前位于水平走廊中,你会看到。 (我的图中是红色的),然后你知道它是向左还是向右:现在只测试x是左边还是右边你知道。

同样适用于垂直走廊&#39; (蓝色)。

然后,如果子弹既不在这些走廊里,你也会发生角落碰撞,还有四个要处理。

伪代码:

 if ( bullet was previously in the red horizontal corridor)  {
     if ( was on the left )
          left collision
     else
          right collision
 } else if ( bullet was previously in the blue vertical corridor) {
     if ( up )
           up collision
     else
           down collision
 } else { // corner case
     // ... Test which of the 4 corner it was in
     if (was upper) {
           if (was left ) 
               up and left
           else
               up and right
     } else { // lower
           if (was left ) 
               down and left
           else
               down and right
     } 
 }

例如,第一个if写道:

if ( Math.abs(oldBulletY-enemyY) < enemiHeight/2 ) {
    if (oldBulletX < enemyX ) {
       // collision on the left
    } else {
       // collision on the right
    }
}

请注意,这是一个近似值:在对角线命中的情况下,子弹也可能击中一侧或另一侧,或两者(角落)。但这应该很好。

如果你想要完全精确,你必须去一个段与段交叉:问题变成:敌人的四个段中的哪一个与(oldBulletPosition,newBulletPosition)段相交。并且不要忘记角落的情况。

我认为上面的解决方案应该在95%的时间内足够好,特别是因为你的子弹很慢。

编辑:我找到了一个更简单的解决方案,使用&#39; real&#39;象限,如图中所示:

enter image description here

因此,根据象限(1,2,3,4),您知道哪个被更准确地击中了。对不起,但现在没时间(无聊的)三角函数,请告诉我你是否感兴趣(第一个解决方案可能已经足够好了)。