Optional
props: StaticProps & MutablePropsProtected
_callbacksCallbacks instance
Protected
_canvasThe canvas element created for rendering
Protected
_ctxThe 2D rendering context.
Protected
_destroyableStores actions that need to be executed when the module is destroyed
Protected
_dprThe current device pixel ratio (DPR)
Protected
_heightThe current height of the canvas, considering the device pixel ratio (DPR)
Protected
_isTracks whether the module has been destroyed
Protected
_propsCurrent properties
Protected
_widthThe current width of the canvas, considering the device pixel ratio (DPR)
Retrieves the module's callbacks instance.
Checks if the canvas is ready to render.
The canvas element instance.
Returns the 2D rendering context
Current device pixel ratio.
Protected
hasChecks if the media element has the requestVideoFrameCallback
method
Canvas height (DPR applied).
Checks if the module has been destroyed.
The name of the module, derived from the class name
Height without DPR scaling.
Width without DPR scaling.
Optional prefix for classnames used by the module
Current properties. Do not mutate these directly, use updateProps
instead.
Canvas width (DPR applied).
Protected
_addAdds a class name on an element, and keeps track of it for removal when the module is destroyed.
The target DOM element.
The class name to toggle.
Protected
_cnHelper function to generate classnames with the module's prefix.
The class names to generate.
A string of class names with the module's prefix applied.
Protected
_destroyInternal method to handle the destruction of the module. It removes all callbacks, destroys properties, and cleans up event listeners and class names.
Get default mutable properties
Get default static properties
Protected
_handleHandle property mutations
Protected
_prerenderPrerenders the media onto the canvas using the specified positioning rule.
Protected
_requestAuto rendering for videos
Protected
_setAdd media events
Destroys the module, cleaning up resources, callbacks, and event listeners.
Adds a custom callback to the module.
The event type to listen for (e.g., 'props', 'destroy').
The function to execute when the event is triggered.
Additional settings for the callback.
Adds a callback on the module's destruction.
The function to execute during destruction.
Pre-renders the media resource onto the canvas.
Resize the canvas
The
CanvasMedia
class allows pre-rendering of media (such as images or video) onto a canvas. This can be useful for reducing payloads by preparing the media for further use in a more optimized form.Documentation