在 testCollision 函数之后查找矩形的哪一侧发生碰撞
Find which side of rectangle collided after testCollision function
我目前有两个对象 bulletList 和 enemyList,每个对象都包含它们在 canvas 上的 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");
仅从当前位置无法知道子弹从何处击中。现在子弹在敌人的内部,例如如果它在左上角,它也可能来自左侧或顶部。
所以你需要存储子弹之前的位置。
根据 'quadrant' 那个旧位置,然后你可以决定你应该做什么。
我画了一张小图来说明:
你看到如果子弹之前在 'horizontal corridor' 中(在我的图中是红色的),那么你就知道它是左边还是右边:现在只需测试 x 是在左边还是右边你就知道了。
'vertical corridor'(蓝色)也是如此。
然后,如果子弹既不在那些走廊里,你就有一个角落碰撞,并且有四个案例要处理。
伪代码:
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% 的情况下应该足够好,特别是因为你的子弹很慢。
编辑:我找到了一个更简单的解决方案,使用 'real' 个象限,如下图所示:
所以根据象限 (1,2,3,4),您知道哪个被击中更准确。抱歉,现在没时间学习(无聊的)三角函数,如果您有兴趣请告诉我(第一个解决方案可能就足够了)。
我目前有两个对象 bulletList 和 enemyList,每个对象都包含它们在 canvas 上的 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");
仅从当前位置无法知道子弹从何处击中。现在子弹在敌人的内部,例如如果它在左上角,它也可能来自左侧或顶部。
所以你需要存储子弹之前的位置。
根据 'quadrant' 那个旧位置,然后你可以决定你应该做什么。
我画了一张小图来说明:
你看到如果子弹之前在 'horizontal corridor' 中(在我的图中是红色的),那么你就知道它是左边还是右边:现在只需测试 x 是在左边还是右边你就知道了。
'vertical corridor'(蓝色)也是如此。
然后,如果子弹既不在那些走廊里,你就有一个角落碰撞,并且有四个案例要处理。
伪代码:
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% 的情况下应该足够好,特别是因为你的子弹很慢。
编辑:我找到了一个更简单的解决方案,使用 'real' 个象限,如下图所示:
所以根据象限 (1,2,3,4),您知道哪个被击中更准确。抱歉,现在没时间学习(无聊的)三角函数,如果您有兴趣请告诉我(第一个解决方案可能就足够了)。