Trouble with collission between map and player

[chazzlabs]

I've successfully created and loaded a tilemap using Tiled, but I'm having trouble handling collision between my player sprite and the tiles on my map.  I've searched the forums, but unless I'm overlooking something, it seems like I'm doing everything that's recommended both on the forums and in the example code.  I've also been referencing this tutorial: http://www.gamedevacademy.org/html5-phaser-tutorial-top-down-games-with-tiled/  Here's what I'm working with:

'use strict';function Play() {    this.player = null;    this.enemy = null;    this.map = null;    this.layer = null;}Play.prototype = {    preload: function () {        var Player = require('../entities/player');        this.player = new Player(this.game);        this.player.preload();        var Enemy = require('../entities/enemy');        this.enemy = new Enemy(this.game);        this.enemy.preload();        this.game.load.tilemap('map1', 'assets/maps/map1.json', null, Phaser.Tilemap.TILED_JSON);        this.game.load.image('mapSprites', 'assets/maps/spritesheet.png');    },    create: function () {        this.game.physics.startSystem(Phaser.Physics.ARCADE);        this.player.create();        this.enemy.create();        this.map = this.game.add.tilemap('map1');        this.map.addTilesetImage('Level', 'mapSprites');        this.layer = this.map.createLayer('Tile Layer 1');        this.map.setCollisionBetween(1, 1000, true, 'Tile Layer 1');        this.layer.resizeWorld();    },    update: function () {        this.game.physics.arcade.collide(this.player, this.layer);        this.player.update();    }};module.exports = Play;

In my Player class, I'm setting gravity on the player and using velocity for movement in my update() function (eg, "velocity.x = this.playerSpeed").

 

This may be a silly question, and it doesn't seem like this is the case based on the tutorial I linked, but should the player sprite be contained within the tileset or be linked to it somehow in order for collision between the player and the tiles to happen?

[satanas]

I experienced a similar issue and after a lot of testing and reading I figured out that I was overriding the "type" attribute on the sprite. I realized that because I printed both objects and checked each attribute. In my case, the sprite had width = 0 and height = 0, reason why there was no collision.

 

I would print your objects like this:

update: function () {    console.log('player ---->', this.player);    console.log('layer ----->', this.layer);    this.game.physics.arcade.collide(this.player, this.layer);    this.player.update();}

Check that your player has bounds (width and height) and that everything looks normal.

 

 

Another trick that could help to debug is verify if there is any collision indeed. Use something like this:

update: function () {    this.game.physics.arcade.collide(this.player, this.layer, this.onCollision, this.onProcess);    this.player.update();},onCollision: function(self, object) {    console.log('onCollision', self, object);},onProcess: function(self, object) {    console.log('onProcess', self, object);}

That would print console logs for the process callback (before the collision is detected) and for the collision callback (after the collision is detected).

 

I hope that helps