Tilemap Resize

[wkd-aine]

Hi, I am updating a game from Phaser2 to 3, and was hoping someone can help!

The game is a platformer game, somewhat similar to the Mario demo game, but the tilemap needs to resize on smaller screens to allow a range of browsers to be used to play the game. In Phaser2 the following code worked

layer = map.createLayer( 'tiles' );
layer.setScale( scale_y )
layer.resizeWorld();
if( scale_y != 1)  layer.resize(tile_width, tile_height);

I have tried multiple approaches to getting the tiles to resize in Phaser 3 and realise that we don't have the same scaling functionality as before, but was hoping someone has some ideas on how this can be achieved. I have managed to resize the actual tiles, but then the extra tiles that are then displayed aren't rendered, see print screen below. You can see that the physics body is being added correctly, not sure if it makes any difference but am using matterJS, see code below

if( utils.DEBUG ) {
  scene.matter.world.createDebugGraphic()
  scene.matter.world.drawDebug = true
}

let size = utils.TILE_SIZE * utils.scale_y
var map = scene.make.tilemap({ key: 'map_level' })
var tiles = map.addTilesetImage('world_tiles')

var layer = map.createStaticLayer( 'tiles', tiles, 0, 0 )
  .setScale( utils.scale_y )
  .setScrollFactor( 0 )
  .setCollisionByProperty({ collides: true })
// if( utils.scale_y != 1 ) layer.resizeWorld( utils.TILE_WIDTH, utils.TILE_HEIGHT )

scene.matter.world.setBounds( size, utils.TILE_HEIGHT )
scene.matter.world.convertTilemapLayer( layer )

 

If you need anything clarified please let me know.

Many thanks in advance

Áine

[joshua123]

Hey @wkd-aine

facing the same issue, any luck solving it?

[TaFroggo]

I found that you can scale each individual layer by running something like this:

map.layers.forEach((layer) => {
  layer.tilemapLayer.scale = 0.2 // Scale factor
});

Hope this helps!