Camera

Camera

new Camera(x, y, zoom)

Look at the Camera reference pages before reading these docs. A `camera` object is created automatically when p5play loads. Currently, there can only be one camera per p5.js instance. A camera facilitates scrolling and zooming for scenes extending beyond the canvas. A camera has a position, a zoom factor, and the mouse coordinates relative to the view. The camera is automatically created on the first draw cycle. In p5.js terms the camera wraps the whole drawing cycle in a transformation matrix but it can be disable anytime during the draw cycle for example to draw interface elements in an absolute position.
Source:
Parameters:
Name Type Description
x Number Initial x coordinate
y Number Initial y coordinate
zoom Number magnification

Members

pos :Object

The camera's position. {x, y}
Source:
Type:
  • Object

position :Object

The camera's position. Alias for pos.
Source:
Type:
  • Object

x :Number

The camera x position.
Source:
Type:
  • Number

y :Number

The camera y position.
Source:
Type:
  • Number

zoom :Number

Camera zoom. A scale of 1 will be the normal size. Setting it to 2 will make everything twice the size. .5 will make everything half size.
Default Value:
  • 1
Source:
Type:
  • Number

Methods

off()

Deactivates the camera. The canvas will be drawn normally, ignoring the camera's position and scale until camera.on() is called
Source:

on()

Activates the camera. The canvas will be drawn according to the camera position and scale until camera.off() is called
Source:

zoomTo(target, speed) → {Promise}

Zoom the camera at a given speed.
Source:
Parameters:
Name Type Description
target Number The target zoom.
speed Number The amount of zoom per frame.
Returns:
Type:
Promise
A promise that resolves when the camera reaches the target zoom.