Jump to content

[1.1.5] Tilemap collision with sprite


Bobov
 Share

Recommended Posts

Hi everyone,

 

I've been using phaser for a while but now i'm stuck for few days already and can't find an answear on the forum. Anyway the problem is there is no collision appearing when i'm moving player around the map. When debug is on i see green lines exactly where is the border between the road and collision area just as i wanted. Tile 34 from desert.png is the route to follow. Thank You in advance, This is my code:

function preload() {game.load.image('player', 'assets/player.png');game.load.image('line', 'assets/line.png');game.load.tilemap('map', 'assets/map.json', null, Phaser.Tilemap.TILED_JSON);game.load.image('tiles', 'assets/desert.png');}function create() {game.world.setBounds(0, 0, 480, 800);map = game.add.tilemap('map');map.setCollisionByExclusion([34], true);map.addTilesetImage('desert', 'tiles');layer = map.createLayer('Tile Layer 1'); layer.resizeWorld();layer.debug = true;player = game.add.sprite(game.world.width / 2, game.world.height - 1 - tileSize / 2, 'player');player.anchor.setTo(0.5, 0.5);player.body.collideWorldBounds = true;gravity = game.add.tileSprite(0, game.world.height - 30, game.world.width, 30, 'line');gravity.alpha = 0.3;click = game.input.activePointer;}
function update() {	game.physics.collide(player, layer, colHandler, null, this);........}function colHandler() {	console.log('collison');}
Link to comment
Share on other sites

Trying setting the collisions like:

map.setCollisionBetween([],true);

Find the I.D. Of the tiles you want to collide with and put them in the [] in the setCollisionBetween.

Or you can collide with a single tile by setting:

map.setCollision(10,true);

Same rule applies. But don't use the array as its only a single tile I.D.

Give it a go and try

:)

Link to comment
Share on other sites

Thank You but before it was setCollisionBetween(1,33); and setCollisionBetween(35,64); and it was also wrong :/ This is just my another try to solve it.

 

I think the problem might not be with setCollision... but with physics.collide, because as i turn on layer.debug it shows green lines as i wanted. This is a very simple tilemap with fields, plants and building and only tile nr 34 which is the road and the player can move only on this tile. I'm stuck for 5 days now and i have no idea why...

Link to comment
Share on other sites

i'm using tilemaps in my game. 3 of them to be exact. Now in the JSON the names are declared and the layer is declared. Now the tiles need the collision index verified then in the update you need the layer and the player to collide.

Here is my set up and this works for me across the 3 tilemaps i currently have coded in:

var map;var layer;// then createcreate: function ()    {        map = this.add.tilemap('level02');        map.addTilesetImage('Space02', 'tiles');          map.setCollisionBetween(211, 238); // Main Floor        layer = map.createLayer('Space02');        layer.resizeWorld();    }// then updateupdate: function()    {        this.physics.collide(player, layer);    )

If the code above isnt any help to your current set up then im afraid i have no idea. The above suggested code i put here is pulled directly from my current dev project and i have no issues. 

The main issue for me was learning about the JSON file. 

Eg:

{ "height":30, "layers":[        {         "data":[TILE ID's ARE IN HERE 0,0,0,0,0,0 AS AN EXAMPLE],         "height":30,         "name":"Space02",// this is the layer. layer = map.createLayer('Space02');         "opacity":1,         "type":"tilelayer",         "visible":true,         "width":50,         "x":0,         "y":0        }], "orientation":"orthogonal", "properties":    {    }, "tileheight":32, "tilesets":[        {         "firstgid":1,         "image":"tilemap.png",         "imageheight":736,         "imagewidth":1120,         "margin":0,         "name":"Space02", // this is >> map.addTilesetImage('Space02', 'tiles');         "properties":            {            },         "spacing":0,         "tileheight":32,         "tilewidth":32        }], "tilewidth":32, "version":1, "width":50}

Then in preloading you load the tilesheet which in my case is named 'tiles'

this.load.image('tiles', 'assets/tilemap.png');

Then load the JSON 

this.load.tilemap('level02', 'assets/map02.JSON', null, Phaser.Tilemap.TILED_JSON);

They should all work perfectly as long as all namespaces and update checks are correct.

:)

Link to comment
Share on other sites

Yes i see the map created perfect from the tiles i've chosen, and the player image is also visible and i can move it but the problem is, i can do it everywhere :) I used Tiled to create JSON but i think i'll start once again from the top with mapeditor and we'll see.

 

JSON:

{ "height":25, "layers":[        {         "data":[30, 30, 30, 30, 30, 30, 33, 34, 35, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 33, 34, 35, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 33, 34, 35, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 33, 34, 35, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 33, 34, 35, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 33, 34, 35, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 33, 34, 35, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 33, 34, 35, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 33, 34, 35, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 33, 34, 35, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 33, 34, 35, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 33, 34, 35, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 33, 34, 35, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 33, 34, 35, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 33, 34, 35, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 33, 34, 35, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 33, 34, 35, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 33, 34, 35, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 25, 45, 34, 35, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 33, 34, 34, 35, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 33, 34, 36, 43, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 33, 34, 44, 27, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 33, 34, 34, 35, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 41, 37, 34, 35, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 30, 33, 34, 35, 30, 30, 30, 30, 30, 30],         "height":25,         "name":"Tile Layer 1",         "opacity":1,         "type":"tilelayer",         "visible":true,         "width":15,         "x":0,         "y":0        }], "orientation":"orthogonal", "properties":    {    }, "tileheight":32, "tilesets":[        {         "firstgid":1,         "image":"desert.png",         "imageheight":199,         "imagewidth":265,         "margin":1,         "name":"desert",         "properties":            {            },         "spacing":1,         "tileheight":32,         "tilewidth":32        }], "tilewidth":32, "version":1, "width":15}
Link to comment
Share on other sites

The other stuff onscren in the image is stuff from my current dev. i just threw the map and JSON  into it but didnt bother removing the other stuff. lol 

 

 

But heres the full code anyway:

 

Preload:

this.load.image('tiles2', 'assets/desert.png');this.load.tilemap('test', 'assets/maptest.JSON', null, Phaser.Tilemap.TILED_JSON);

Create:

map  = this.add.tilemap('test');        map.setCollision(30);        map.addTilesetImage('desert', 'tiles2');        layer = map.createLayer('Tile Layer 1');         layer.resizeWorld();        layer.debug = true;

Update:

this.physics.collide(player, layer);

That was it.

 

//EDIT added the update of the collisions for map

Link to comment
Share on other sites

Well thanks to You Heppell08 i was sure my collision functions and JSON file were ok, so i was looking for other solution. Then i finally found the problem. Well, physics.collide works only (i think) if we're using position change by velocity plus or minus, but if someone (like me) tries to move a sprite manually with changing body.x and body.y on his own without velocity, phaser dosen't see it as moving the body to another location but as appearing on another location, like he jumped over that green line from debug and collision didn't occured.

 

I'm just explaining it in case someone else got the same problem. For most of You it could have been obvious. Thanks :)

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...