Collision between one and multiple object

[lars]

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.

[ivan.popelyshev]

It should work. Please post the complete example, and make it as small as possible so I can actually read it in a minute.

[lars]

Ok. Heres it is. And thank you very much for your time. Hope the code make sense ?

I have attached 2 files:

The Hittest class and the Actor class. Where it all happens. Hopefully you will be able to read it in a minute ?

Hittest.js

Actors.js

[ivan.popelyshev]

500 lines, no working app, and my eyes dont see a problem there. I just dont understand where do you check it with multiple objects, i see only one comparsion

[lars]

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

 

 

 

 

 

[lars]

Heres a working app. Its still in the Actors.js i doing my intersection. Thank you very much for having a look at it.

 

[lars]

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 ?