Show:
Module: p5.play
Parent Module: p5.play

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.

Table of Contents

Constructor

Camera
(
  • x
  • y
  • zoom
)

Defined in lib/p5.play.js:3212

Parameters:

  • x Number

    Initial x coordinate

  • y Number

    Initial y coordinate

  • zoom Number

    magnification

Methods

isActive () Boolean

Defined in lib/p5.play.js:3311

Check to see if the camera is active. Use the methods Camera.on() and Camera.off() to enable or disable the camera.

Returns:

Boolean:

true if the camera is active

off ()

Defined in lib/p5.play.js:3338

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

on ()

Defined in lib/p5.play.js:3323

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

Properties

active

Boolean

Defined in lib/p5.play.js:3301

True if the camera is active. Read only property. Use the methods Camera.on() and Camera.off() to enable or disable the camera.

mouseX

Number

Defined in lib/p5.play.js:3279

MouseX translated to the camera view. Offsetting and scaling the canvas will not change the sprites' position nor the mouseX and mouseY variables. Use this property to read the mouse position if the camera moved or zoomed.

mouseY

Number

Defined in lib/p5.play.js:3290

MouseY translated to the camera view. Offsetting and scaling the canvas will not change the sprites' position nor the mouseX and mouseY variables. Use this property to read the mouse position if the camera moved or zoomed.

position

p5.Vector

Defined in lib/p5.play.js:3229

Camera position. Defines the global offset of the sketch.

x

Number

Defined in lib/p5.play.js:3237

Camera x position. Defines the horizontal global offset of the sketch.

y

Number

Defined in lib/p5.play.js:3253

Camera y position. Defines the horizontal global offset of the sketch.

zoom

Number

Defined in lib/p5.play.js:3269

Camera zoom. Defines the global scale of the sketch. 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.