简体   繁体   中英

Collision detection in Javascript game made using createJS

Hello I am making a space shooter game and I want to check collision between boss and player bullets. The problem I am facing is that collision between boss bullet and player is perfectly detected but boss is colliding with its own bullet and loosing all its health and this happens only when animation goes to left side of canvas. Here is my code

function fire_Boss02_first(){

        var boss02_bullet_first=bullet_first.clone();
        boss02_bullet_first.x=boss02.x+bullet2_boss_stats.offSetX;
        boss02_bullet_first.y=boss02.y+bullet2_boss_stats.offSetY;
        boss02_bullet_first.st=bullet2_boss_stats;
        stage.addChild(boss02_bullet_first);
        time=(boss02_bullet_first.y+500)/0.99;
        createjs.Tween.get(boss02_bullet_first).to({y:1000},time);
        boss02_bullet_first.addEventListener("tick",collisionEvent);
        function collisionEvent(event) {
            for(var i=0; i<stage.children.length; i++){
                if(stage.getChildAt(i).name == "player"){
                    var intersection = ndgmr.checkRectCollision(stage.getChildAt(i),boss02_bullet_first );
                    if(intersection != null){
                        stage.getChildAt(i).st.health = stage.getChildAt(i).st.health - boss02_bullet_first.st.damage;
                         health_txt.text="ENERGY: "+stage.getChildAt(i).st.health;
                        if(stage.getChildAt(i).st.health <= 0){
                            explode = explode_fx.clone();
                            explode.x=stage.getChildAt(i).x -50;
                            explode.y=stage.getChildAt(i).y -50;
                            explode.addEventListener("animationend", endAnimation); 
                                function endAnimation(event) {
                                stage.removeChild(explode);
                             }                              
                             stage.addChild(explode);
                             stage.removeChildAt(i);
                             lives--;
                             lives_txt.text = "LIVES: " + lives;
                        }
                        stage.removeChild(boss02_bullet_first);
                        intersection = null;
                    }
                }   

                else if(stage.getChildAt(i).name == "boss02"){
                        var intersection = ndgmr.checkRectCollision(stage.getChildAt(i),bullet);
                        if(intersection != null){
                        stage.getChildAt(i).st.health = stage.getChildAt(i).st.health - bullet.st.damage;
                        console.log(stage.getChildAt(i).st.health);
                        console.log(bullet);
                        if(stage.getChildAt(i).st.health <= 0){
                            score+=500;
                            score_text.text="SCORE: "+score;
                            explode = explode_fx.clone();
                            explode.x=stage.getChildAt(i).x +50;
                            explode.y=stage.getChildAt(i).y +50;
                            explode.addEventListener("animationend", endAnimation); 
                                function endAnimation(event) {
                                stage.removeChild(explode);
                             }                              
                             stage.addChild(explode);
                             stage.removeChildAt(i);

                        }
                        stage.removeChild(bullet);
                        intersection = null;
                    }
                }

            }
        }

    }

这是控制台输出

This is the Console Output. I am using ndgmr.checkRectCollision for collision detection. Cant seem to find the bug.Any more code necessary do let me know Thanks.

Something useful from a recent EaselJS prototype I've been working on:

if ( shipBox.x >= enemyBox.x + enemyBox.width || shipBox.x + shipBox.width <= enemyBox.x || shipBox.y >= enemyBox.y + enemyBox.height || shipBox.y + shipBox.height <= enemyBox.y )
{
  return false;
}else{
  return true;
}    

This similarly helped me when I was trying to draw those bounding boxes:

function DrawBoundingBox(collider){
    var bb = new createjs.Shape();
    bb.graphics.clear().beginStroke("black").drawRect(collider.x, collider.y, collider.width, collider.height);
    bb.regX = collider.width / 2 + collider.x;
    bb.regY = collider.height / 2 + collider.y;
    bb.x = collider.x;
    bb.y = collider.y;
    stage.addChild(bb);
    stage.update();
} 

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM