JavaScript碰撞检测似乎不起作用?

时间:2014-03-14 19:50:08

标签: javascript animation canvas collision-detection

所以我正试图在我的Alien Invaders演绎中设置碰撞检测。但它几乎不起作用。我几乎不是说我从来没有得到有效的命中,或true回归。我甚至尝试了一些不同的方法,但无论出于何种原因,我都无法得到正确的答案。

碰撞检测是针对玩家向异形船发射的子弹,只是为了澄清,如果重要的话:D。

这是碰撞检测代码:(我试图让它容易出错,希望有一个命中,虽然没有方法似乎有效)

var isCollidingWithAlien = function(shot){
    var alienImg = document.getElementById('alien');
    for(var i = 0; i < aliens.length; i++){
        return shot.x               < aliens[i].x + alienImg.width  && 
        shot.x + shot.img.width     > aliens[i].x                   &&
        shot.y                      < aliens[i].y + alienImg.height && 
        shot.y + shot.img.height    > aliens[i].y;
    }
};

不是代码没有被调用,也不是一些奇怪的技术错误。它永远不会真实。

此外,如果您想查看所有代码,请参阅JSFiddle

@Update: 一直在玩代码,它似乎正确地注册了第一个Alien创建的,如果你看看JSFiddle就在左上角。虽然不知道为什么

1 个答案:

答案 0 :(得分:3)

问题是,你只返回列表中第一个外星人的碰撞。在所有外星人都没有碰撞之后,如果你对某些外星人说实话,你应该返回true,或者返回false:

var isCollidingWithAlien = function(shot){
    var alienImg = document.getElementById('alien');
    for(var i = 0; i < aliens.length; i++){
        var result = shot.x         < aliens[i].x + alienImg.width  && 
        shot.x + shot.img.width     > aliens[i].x                   &&
        shot.y                      < aliens[i].y + alienImg.height && 
        shot.y + shot.img.height    > aliens[i].y;
        if(result)
            return true;
    }
    return false;
};