Tilemap collides with player and moves as one solid object (Phaser 3)

Question

I have a tilemap that I'm generating from an array, (I can't use tiled, the game will be procedurally generated) that I need to collide with the player, but instead of the player colliding with the wall layer, when the player goes outside of the camera bounds and the tilemap and comes back in, they push the tilemap off the screen. My tilemap code is here, simplified. I'm guessing I need to be able to add blank tiles, but I'm not sure how.

var room = [
  [1, 2, 2, 3],

  [4, 0, 0, 8],

  [4, 0, 0, 8],

  [5, 6, 6, 7],];

this.map = this.make.tilemap({ data: room, tileWidth: 64, tileHeight: 64 });
var tiles = this.map.addTilesetImage("wall");
var layer = this.map.createLayer('wallLayer', tiles, 0, 0)
layer.setCollisionBetween(1, 8, true, true, layer)
this.physics.add.existing(layer)
this.physics.add.collider(layer, this.player)

Any help would be great, thanks!

Answer 1

The problem is, that you are adding the layer to the physics world with the line of code

this.physics.add.existing(layer);

in the file camp.js line 126

This is not needed! Since the two lines of code,

layer.setCollisionBetween(1, 16, true, false, layer); //(line 125) 
this.physics.add.collider(layer, this.player); //(line 127) 

in the file camp.js

set the collisions up between player and layer. No other action is needed to achieve collisions.