Phaser tilemap draw position question

[Phorey]

Hey guys,

I'm using the Tiled map editor and creating it with the code below:

//GAME PRELOADER
    this.load.tilemap('map_testmap', 'assets/phaser_assets/maps/map_testmap.json', null, Phaser.Tilemap.TILED_JSON);
    this.load.image('grass', 'assets/phaser_assets/tiles/grass.png');
    this.load.image('spike', 'assets/phaser_assets/tiles/test_spike.png');

//GAME CREATE
  create: function() {
    // this.scale.pageAlignVertically = true;
    this.world.setBounds(0, 0, 2000, 1400);
    this.physics.startSystem(Phaser.Physics.ARCADE);
    this.stage.backgroundColor = '#3A5963'
    // this.add.sprite(0, 0, 'sky');

    var map = this.add.tilemap('map_testmap');
    map.addTilesetImage('grass', 'grass');
    map.addTilesetImage('spike', 'spike');
    map.setCollision([0, 1, 2, 15, 16, 17, 18, 19, 20, 30, 31])
    this.layer = map.createLayer('Tile Layer 1');
    // this.layer.fixedToCamera = false;
    // this.layer = map.createLayer('Tile Layer 1', 2000, 1400);
    // this.layer.anchor.setTo(0.5);
    // this.layer.position.set(this.world.centerX, this.world.centerY);
    this.layer.resizeWorld();

However, when I start the game up, my layer looks like this, but my actual layer looks like the image on the right.

So my question is, how can I push the layer down on the canvas programmatically?

I've tried changing the position, but it seems that the collision doesn't move with the layer's position.

 

Any help would be greatly appreciated!

[samme]

If you're using camera.follow, the camera has panned downwards to follow the sprite. So remove that and any other camera operations and then see if it looks like what you expect.

There's no need to use both world.setBounds and layer.resizeWorld. They're both setting the same boundary.

Double-check that the game width and height are what you want.

game.debug.cameraInfo(…) will show you the camera position and boundary.

Edited November 17, 2017 by samme

[Phorey]

After trying out your suggestions, the layer still didn't display correctly, but debugging helped me find out that the top half isn't rendering at all.

I took a look at the json file and turns out there was a -340y offset applied to the tmx file.  Removing the offset solved the issue!

Thanks for your help!

[samme]

Oops I meant debug.cameraInfo.