Camera(s) in v3

[quarks]

I know official documentation is limited right now, but is there any explanation of the new camera functionality available anywhere? I am especially interested in the idea of using a second camera to do a minimap. I have looked at the examples, and I just can't quite grok how the size, position, bounds, and scale options for a camera work together.

[Karma Octopus]

var minimapCamera = this.cameras.add(512, 0, 512, 384);
minimapCamera.zoom = 0.5;

This creates a minimap camera at pos 512, 0 with a size of 512, 384. Then it sets the scale to be half that of your regular rendering.

If your need to set other properties on the minimap camera you can do that just like how you set properties on your main camera.

minimapCamera.setBounds(0, 0, mapWidth * tileWidth, mapHeight * tileHeight);
minimapCamera.scrollX += 100;
minimapCamera.x = 100;

For example.

[Karma Octopus]

Actually forget what I said above.

I turns out that once you change the scale of the camera things start to get messed up real fast. Few things behave as expected.

I thought it would be easy to add a minimap camera but it seems it not quite so. Not right now anyways, I'm sure it'll get fixed. Or maybe I just suck at phaser.

[rich]

Camera x/y/width/height should be considered the viewport sizes. I.e. the size the camera renders to. Indeed the method 'setViewport' is used to set all those values.

Camera zoom is the pixel ratio of what it renders. A zoom of 0.5 will render at half the size (zoomed out), 2 will render zoomed in, etc. Cameras don't have a scale, just a zoom factor. Think of it being as how far into, or out of, the scene it is focusing. The rotation property controls the rotation of the camera from its center. All this does is rotate the region that is rendered, it doesn't impact the world.

So with viewport, zoom and rotation you can size the physical rendering of the camera and the pixel density of it, but to actually move the camera around the world you use scrollX and scrollY. This adjusts the position that camera is 'looking at'. Game Objects have the related method 'setScrollFactor' which allows you to configure how much the camera moving influences their rendered position within it (it never impacts their actual world coordinates).

Camera bounds do not limit what can be drawn to the camera, they only limit the scrollX/Y values to stop you from 'scrolling past' the borders of a camera.

To do a minimap I think it's easier to explain with code, so I put together this example for you:

http://labs.phaser.io/view.html?src=src\camera\minimap camera.js

Cursors to fly the ship.

I didn't add edge-wrapping, or the ability to shoot, sorry  but you get the idea. Notice how I excluded the stars from the minimap to stop them rendering to it.

[rich]

[quarks]

19 hours ago, rich said:

To do a minimap I think it's easier to explain with code, so I put together this example for you:

http://labs.phaser.io/view.html?src=src\camera\minimap camera.js

Cursors to fly the ship.

I didn't add edge-wrapping, or the ability to shoot, sorry  but you get the idea. Notice how I excluded the stars from the minimap to stop them rendering to it.

Thanks, Rich. This is just what I needed. I'll give it a study.