Sign in to follow this  
lars

Collision between one and multiple object

Recommended Posts

Hello Everybody

Trying to make a collision detection between two object.

I have one object there is going to catch another object. Theres a new obejct to catcht every 10 seconds, and every thing goes fine when i catchs one object at time. But when theres multiple object on stage, something going wrong:

 

Heres what im doing:

Creating a "collector":

this.spr_Con = new PIXI.Container();
this.scene.addChild(this.spr_Con);

//Then creating the hitarea

  this.spr_hitArea = new PIXI.Graphics();
                this.spr_hitArea.beginFill("0xffffff");
                this.spr_hitArea.alpha= 0.5;
                this.spr_hitArea.drawRect(-20, 0, 40, 40);
                this.spr_Con.addChild(this.spr_hitArea);


 

Then creating some objects to collide with:

  this.setNinja = setInterval(() => {


 this.spr_ninjaCon = new PIXI.Container();
 this.scene.addChild(this.spr_ninjaCon);

this.ninja_hitArea = new PIXI.Graphics();
                        this.ninja_hitArea.beginFill("0x000000");
                        this.ninja_hitArea.alpha= 0.5;
                        this.ninja_hitArea.drawRect(-20, -20, 40, 40);
                        this.spr_ninjaCon.addChild(this.ninja_hitArea);


}, 10); //END interval

So every 10 seconds i spawn a new object. Then I have a simple hittest class:

 

export default class Hittest {


    constructor() {
   
    }


    checkme(a,b){

        var ab = a.getBounds();
        var bb = b.getBounds();
        return ab.x + ab.width > bb.x && ab.x < bb.x + bb.width && ab.y + ab.height > bb.y && ab.y < bb.y + bb.height;

    }

};

 

And check for intersection:

  this.app.ticker.add(() => {

 if (  this.collectNinjas.length > 0) { // is there any object

   if (this.ht.checkme(this.spr_hitArea, this.ninja_hitArea)) {

console.log('intersection true');

    this.scene.removeChild(this.spr_ninjaCon);

}
}

 }); //End app.ticker

Every things goes fine as long as there is only one object "living" on stage, but as soon I have multiple object on stage it cant allways recognize the intersection. Is it my Hittest.js class that fails om multiple object? Hope someone can help me.

Share this post


Link to post
Share on other sites

Sorry. Theres only one comparison. So maybe thats the problem. But how do I compare with multiple object. I tried something like looping through my comparison

 

  this.setNinja = setInterval(() => {


 this.spr_ninjaCon = new PIXI.Container();
 this.scene.addChild(this.spr_ninjaCon);

this.ninja_hitArea = new PIXI.Graphics();
                        this.ninja_hitArea.beginFill("0x000000");
                        this.ninja_hitArea.alpha= 0.5;
                        this.ninja_hitArea.drawRect(-20, -20, 40, 40);
                        this.spr_ninjaCon.addChild(this.ninja_hitArea);

   this.collectNinjas.push(this.spr_ninjaCon); // pushing object into a array

}, 10); //END interval

These are drawn to stage in a interval

And then I tried to compare intersection in a for loop like this:
 
this.app.ticker.add(() => {

 if (  this.collectNinjas.length > 0) { // is there any object


for(let ii = 0; ii < collectNinjas.length; ii++){

   if (this.ht.checkme(this.spr_hitArea, collectNinjas[ii])) {

console.log('intersection true');

    this.scene.removeChild(this.spr_ninjaCon);

}
}
}

 }); //End app.ticker

But that did'nt do it.

 

I will send you a clean working app 🙂

 
31/5000
 
 
 
 
 
 
 
31/5000
 
 
 
 

 

Share this post


Link to post
Share on other sites

Ok solved it, or my college did 🙂

this.collectNinjas.forEach(ninja =>{

                            if (this.ht.checkme(this.spr_hitArea,  ninja )) {

                               
    
                                this.scene.removeChild(ninja);



    
                            }

                        }

Thank you very much for the help Ivan. Super nice to have guys like you around 🙂

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this  

  • Recently Browsing   0 members

    No registered users viewing this page.