Jump to content

Problem with the Camera in Phaser 3


Recommended Posts

Hello people, 

I have the next problem, 

I'm making a little game with phaser 3, and I getting a strange behavior with the camera. 

I have a tiled map, 640x640, and a little sprite of 16px. So I'm trying that the camera focus  the player a little closer and follow the player, but....


1) When I try to zoom the camera to see the player, (passing a integer 2, 3 o 4 to the setZoom method) the camera distances itself more from the sprite, instead of get closer .

With setZoom (1):


With setZoom (2):




2) If I try to put a slower value, as 0.1, 0.4, the zoom get the camera closer it works, but if I use the startFollow method that makes the camera follow the player, make the screen black (I think it's because focus somewhere else out of the map, but this is an expeted behavior:   API Documentation ), if I don't use the startFollow, and update ScrollX, and ScrollY, it do it alright.  (I get the effect that i want) but everything is working diferent from the expected behavior: the documentation says that higher values make the camera zoom in, no zoom out, also in this way, I have another problem, a new cam that I use has minimap, do not work if I use a decimal value for the zoom ON THE MAIN camera.


I have this config for phaser: 

var config = {
  type: Phaser.AUTO,
  parent: 'phaser-example',
  width: 640,
  height: 640,
  physics: {
    default: 'arcade',
    arcade: {
      debug: false,
      gravity: { y: 0 }
  scene: {
    preload: preload,
    create: create,
    update: update

At the end of the create method I have :


I try to change the camera size, because if I use a higher zoom, the "square" or size of the camera became smaller.


**** I writting this from another machine, but I will update with Screenshoot and more code


Link to comment
Share on other sites

  • 3 weeks later...

If you can't update to the newer phaser, the way around it is to not use the follow method, but to do this:


this.cameras.main.scrollX = this.cameraTargetSprite.x - 400;
this.cameras.main.scrollY = this.cameraTargetSprite.y - 300;

in your update method.

edit - the numbers Im taking away from the sprite position are to centre the camera. Otherwise, it wouldn't be aligned properly. Obviously the numbers would potentially be different for you. This is for a camera of 800/600.

Link to comment
Share on other sites


  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...