How to export from tiled and integrate into Phaser?

[valueerror]

learning.zip

 

so it was like i "tried" to tell you but i wasn't very clear about it.. sorry

your image "Shades_of_blue.jpg" (which btw is a little bit big and you would be better of with a small tilesprite here) anyway.. this image was no multiple of 32 in its height.

therefore i needed to kick it out of tiled editor..  resize it and reimport it..   

 

another error was in this line:

mymap.setCollisionBetween(1,200,true,'layer2');

you need to enable the collision for the tiles 1-200 for one of your layers .. for example "Tile Layer 1"  - layer2 is not existing

 

since you also added shadesofblue as tilesprite background there is no need for the additional blue background layer in the tilemap .. it's much better to use a tilesprite for this because every tilemap layer that needs to be rendered has a huge impact on performance..

 

so here is the working version of your learning example

glhf !

[efecarranza]

hey guys, sorry to jump into the conversation, i've been having some problems with tiled as well, maybe somebody can help.
i made a map with many layers, but realized it wasn't going to work so i made a map for the background, a second image for transparency (like, my main character walks behind the roof of a house cause its a  top down game)
and then i made another map thats only an object layer with blocks on what the user cannot go across, so blocks covering the houses on that layer
what i did was:
 
// Preloader.js
this.load.image('map', 'assets/rq4-bottom.png');
this.load.image('map2', 'assets/rq4-top.png');
this.load.tilemap('rq4map', 'assets/rq4.json', null, Phaser.Tilemap.TILED_JSON);
this.load.spritesheet('hero', 'assets/walk.png', 63, 62);
 
// Game.js
 
// defined all these variables on top such as this.mainmap; etc.
 
create: function()
 

this.world.setBounds(0,0,3200,2400);
this.physics.startSystem(Phaser.Physics.ARCADE);
mainmap = this.add.sprite(0, 0, 'map');
mainmap2 = this.add.sprite(0, 0, 'map2');
mainmapjson = this.add.tilemap('rq4map');
blockedLayer = mainmapjson.createLayer('layer01');
 
// this following line gives a different error
mainmapjson.setCollisionByExclusion([0], false, "layer01");
 
this is the error that i get:
 
Tilemap.createLayer: Invalid layer ID given: null
even though im passing layer01 which is the name of my object layer on my json file
 

then setCollision doesn't work and gives this error: Uncaught TypeError: Cannot read property 'height' of undefined
which i figure is from the fact that createLayer is not working at all
 
is the problem because i don't have a tileset associated with my json file?
im not sure why create layer isn't working, thats the actual name
 
i can't attach a json file apparently to the site so i can't share that, but here's the beginning:

 

{ "height":75,

 "layers":[

        {

         "draworder":"topdown",

         "height":0,

         "name":"layer01",

         "objects":[

 

 

thank you guys and hope somebody can help!

 

 

-fer

[askariwa]

On 22/5/2014 at 9:48 AM, valueerror said:

well .. i made this fully functional tilemap example and uploaded it to my server..  you can try it here: http://test.xapient.net/phaser/tilemapexample/

 

i also attached the whole example as zip file so you can download it and have a look at all the files! i tried to comment as much as possible

 

 

glhf 

 

 

FYI : i tend to use p2 physics because this way i can also use non-square objects and create real hills and slanted tiles to walk upon.. (or materials like ice without friction) also i get the impression that p2 is more reliable - with arcade my player sometimes falls through the tiles  for no reason 

tilemapexample.zip

Could anyone tell me why the p2 physics example don't collide with world bounds ?

I have tried to add game.world.setBounds(0, 0, 1600, 1200) before game.physics.startSystem(Phaser.Physics.P2JS) but moving the player to the left keeps moving him out of the screen. :-(

 

Updated : i had to add instead game.physics.p2.setBoundsToWorld(true, true, true, true, false);  after "placing" the player sprite just as the example here http://phaser.io/examples/v2/p2-physics/tilemap :)