
Security News
ECMAScript 2025 Finalized with Iterator Helpers, Set Methods, RegExp.escape, and More
ECMAScript 2025 introduces Iterator Helpers, Set methods, JSON modules, and more in its latest spec update approved by Ecma in June 2025.
canvas-camera-2d
Advanced tools
A wrapper for camera-2d that supports pan, zoom, and rotate.
Controls are as follows:
Based on orbit-camera.
Also see:
npm i canvas-camera-2d
import canvasCamera2d from "canvas-camera-2d";
Attaches a modified camera-2d-simple
instance to the canvas
, i.e., attaching the required event listeners for interaction.
The following options are available:
distance
: initial distance of the camera. [dtype: number, default: 1
]target
: x, y position the camera is looking in GL coordinates. [dtype: array of numbers, default: [0,0]
]rotation
: rotation in radians around the z axis. [dtype: number, default: 0
]isFixed
: if true
panning, rotating, and zooming is disabled. [dtype: bool, default: false
]isPan
: if true
panning is enabled. [dtype: bool, default: true
]panSpeed
: initial panning speed. [dtype: number, default: 1
]isRotate
: if true
rotation is enabled. [dtype: bool, default: true
]rotateSpeed
: initial panning speed. [dtype: number, default: 1
]isZoom
: if true
zooming is enabled. [dtype: bool, default: true
]zoomSpeed
: initial zooming speed. [dtype: number, default: 1
]Returns a new 2D camera object.
The camera's API is augmented with the following additional endpoints:
camera.tick()
Call this at the beginning of each frame to update the current position of the camera.
camera.refresh()
Call after the width and height of the related canvas object changed.
Note: the camera does not update the width and height unless you tell it to using this function!
Returns [relX, relY]
the WebGL position of x
and y
.
camera.dispose()
Unsubscribes all event listeners.
camera.config(options)
Configure the canvas camera. options
accepts the following options:
isFixed
: if true
panning, rotating, and zooming is disabled. [default: false
]isPan
: if true
panning is enabled. [dtype: bool, default: true
]panSpeed
: panning speed. [dtype: float, default: 1.0
]isRotate
: if true
rotation is enabled. [dtype: bool, default: true
]rotateSpeed
: rotation speed. [dtype: float, default: 1.0
]isZoom
: if true
zooming is enabled. [dtype: bool, default: true
]zoomSpeed
: zooming speed. [dtype: float, default: 1.0
]v0.5.5
v2.0
FAQs
A canvas wrapper for a 2D camera
We found that canvas-camera-2d demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
ECMAScript 2025 introduces Iterator Helpers, Set methods, JSON modules, and more in its latest spec update approved by Ecma in June 2025.
Security News
A new Node.js homepage button linking to paid support for EOL versions has sparked a heated discussion among contributors and the wider community.
Research
North Korean threat actors linked to the Contagious Interview campaign return with 35 new malicious npm packages using a stealthy multi-stage malware loader.