Arcarde Physics - Collision between Group and Tilemap

[Chupup Games]

Hi, I need some help.

 

I want to test the collision between a group and a tilemap.

 this.physics.arcade.collide(this.fireball, this.layer, this.killFireball); 

My function killFireball never gets called...

 

 

First I activate the physics:

 this.physics.startSystem(Phaser.Physics.ARCADE);

Then I create the tilemap like this:

var map = this.add.tilemap('playfield', 32, 32);        map.addTilesetImage('tiles');        map.setCollision(0);        this.layer = map.createLayer(0);        this.layer.resizeWorld(); 

and my group:

this.fireball = this.add.group();        this.fireball.enableBody = true;        this.fireball.physicsBodyType = Phaser.Physics.ARCADE; 

I got a bit lost here. I tried to research how to do this, but in the forum and the examples i didn't find anything that could help me.

[JP91]

maybe physics.arcade.collide(sprite,sprite,callback,null,this);

[Chupup Games]

@JP91 nope, this doesn't help...

[JP91]

hmm it looks so then the problem is in how you add the layer .

[drhayes]

Can you provide a link to a working demo of this problem?

 

I've had trouble in the past where I was sending a null into the collision function when I thought I was sending a sprite instance. Phaser silently returns in that case (IMO that's the right thing to do, just caught me by surprise the first time). I'm wondering if that's happening here..?

 

Another thing to try is use the un-minified version of phaser.js and set a breakpoint on the collide function to see what's happening.

[codevinsky]

The correct line of code for testing collisions should be:

this.physics.arcade.collide(this.fireball, this.layer, this.killFireball, null, this); 

[Chupup Games]

i tried with null, this but still it doesn't wanna work. 

 

here is my create & update function:

Fireball.Game.prototype = {    create: function () {        this.physics.startSystem(Phaser.Physics.ARCADE);        this.add.sprite(0, 0, 'background');        var map = this.add.tilemap('playfield', 32, 32);        map.addTilesetImage('tiles');                this.layer = map.createLayer(0);        this.layer.resizeWorld();        map.setCollision(0);        this.player1 = this.add.sprite(200, 375, 'player', 0);        this.player1.animations.add('jump', [0, 3]);        this.player1.animations.play('jump', 5, true);        this.fireball1 = this.add.group();        this.fireball1.enableBody = true;        this.fireball1.physicsBodyType = Phaser.Physics.ARCADE;        this.fireball2 = this.add.group();        this.fireball2.enableBody = true;        this.fireball2.physicsBodyType = Phaser.Physics.ARCADE;        this.fireball3 = this.add.group();        this.fireball3.enableBody = true;        this.fireball3.physicsBodyType = Phaser.Physics.ARCADE;        this.fireball4 = this.add.group();        this.fireball4.enableBody = true;        this.fireball4.physicsBodyType = Phaser.Physics.ARCADE;        this.time.events.loop(Phaser.Timer.SECOND * 3, this.createFireball, this);    },    update: function () {        this.physics.arcade.collide(this.fireball1, this.layer, this.killFireball, null, this);        this.physics.arcade.collide(this.fireball2, this.layer, this.killFireball, null, this);        this.physics.arcade.collide(this.fireball3, this.layer, this.killFireball, null, this);        this.physics.arcade.collide(this.fireball4, this.layer, this.killFireball, null, this);    },    createFireball: function () {        this.fireball1.create(44, 70, 'fireball', 0, true);        this.fireball1.setAll('body.velocity.y', 60);        this.fireball2.create(39, 396, 'fireball', 0, true);        this.fireball2.setAll('body.velocity.x', 60);        this.fireball3.create(268, 403, 'fireball', 0, true);        this.fireball3.setAll('body.velocity.y', -60);        this.fireball4.create(275, 77, 'fireball', 0, true);        this.fireball4.setAll('body.velocity.x', -60);    },    killFireball: function () {        console.log('bang');    },

[codevinsky]

map.setCollision(0);

 

Do you only have the one tile in your map?

[Chupup Games]

no, but this the tile i want to check for collision with the fireballs, which are on a seperate spritesheet

[codevinsky]

So,

 

tile[0] is the tile you want to check for collision against an item in your fireball group, correct?

[Chupup Games]

yes, exactly. i want to check this one tile from my tilemap (json) with the group (normal sprites).

[codevinsky]

Ok... Let's do a bit of debug:

Fireball.Game.prototype = {    create: function () {        this.physics.startSystem(Phaser.Physics.ARCADE);        this.add.sprite(0, 0, 'background');        var map = this.add.tilemap('playfield', 32, 32);        map.addTilesetImage('tiles');        map.setCollision(0);                this.layer = map.createLayer(0);        this.layer.resizeWorld();        this.layer.debug = true;        this.player1 = this.add.sprite(200, 375, 'player', 0);        this.player1.animations.add('jump', [0, 3]);        this.player1.animations.play('jump', 5, true);        this.fireball = this.add.sprite(44, 70, 'fireball', 0, true);        this.fireball.body.velocity.y = 60;        this.game.physics.arcade.enableBody(this.fireball);                this.time.events.loop(Phaser.Timer.SECOND * 3, this.createFireball, this);    },    update: function () {        this.physics.arcade.collide(this.fireball, this.layer, this.killFireball, null, this);    },    createFireball: function () {        this.fireball = this.game.add.sprite(44, 70, 'fireball', 0);        this.fireball.body.velocity.y = 60;    },    killFireball: function () {        console.log('bang');    },

We're going to turn on debug bodies for the tile map so that you can see where collisions are, and we're going to just create one fireball every 3 seconds.

 

We're also just checking collision against that one fireball. 

 

What happens?

[Chupup Games]

now i get this:

 

1. Uncaught TypeError: Object #<error> has no method 'create' phaser.min.js:9

[Chupup Games]

i changed for this now:

this.fireball1 = this.add.sprite(44, 70, 'fireball', 0);                this.game.physics.arcade.enableBody(this.fireball1);        this.fireball1.body.velocity.y = 60;

and check collision:

this.physics.arcade.collide(this.fireball1, this.layer, this.killFireball, null, this);

still no luck..., no collision detected. i think there is something missing. sad that don't have one example with arcarde, tilemaps and groups  from rich

[Chupup Games]

ok, found something...

 

map.setCollision(0);

 

must be 

 

map.setCollision(1);

 

looks like the tiles start with 1 and not 0 ....  

[codevinsky]

Huh. Interesting.

[rich]

var tileset = map.addTilesetImage('tiles');

console.log(tileset.firstgid); // this is the first tile index, according to the Tiled data