Minimap following player

Phaser 3
1

Hi guys,

So I made a camera and minimap in my game to follow the player. The game size is 800x600 and the bounds is 3200x600. The camera follows the player and everything works perfect, except the minimap.

The minimap is in the top right corner and shows the beginning part of the map, but the minimap doesn’t follow the player but is just in one place. This is my current code:

this.minimap = this.cameras.add(30, 5, 200, 100).setZoom(0.2).setName(‘mini’);
this.minimap.scrollX = 500;
this.minimap.scrollY = 300;

Any of you know how to? And btw, I have read other topics about this and these didn’t work. So it would be nice to explain and not just link the ‘answer’ to an other thread.

2

You have to update scrollX and scrollY.
Try to use

update(player: Player) {
  this.camera.scrollX = player.x
  this.camera.scrollY = player.y
}

See this and this.

3

When I try that, the game doesn’t even start anymore for some reason. I have this under my function create but not sure what/where to change for the minimap to work:

player = this.physics.add.sprite(100, 450, 'goaty');

player.setBounce(0.2);
player.setCollideWorldBounds(true);
this.physics.world.setBounds(0, 0, 3200, 600);
this.cameras.main.setBounds(0, 0, 3200, 600);
this.cameras.main.setSize(800, 600);
this.cameras.main.startFollow(player);
this.minimap = this.cameras.add(30, 5, 200, 100).setZoom(0.2).setName('mini');
this.minimap.scrollX = 500;
this.minimap.scrollY = 300;
4

Basically, you have to make the minimap camera follow the player. Currently, you only set the scroll of the camera when you add it.

yannick’s solution is only an example, which is why it didn’t work for you. In your case, your minimap camera is stored as this.minimap and it doesn’t look as if you’re using a typed language, either. Personally, I suggest you take a look at the startFollow method on cameras, which can make the minimap camera track the player’s position without requiring you to update its scroll manually.

1 Like