Optionalprops: TModuleProps<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.
Canvas height (DPR applied).
Indicates whether the instance has been destroyed.
After destruction, destroy is a no-op.
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 prefixed classes to an element and removes them on destroy.
Skips classes that are already present on the element.
Target DOM element.
Unprefixed class name segments.
Protected_cnBuilds one or more prefixed class names.
Unprefixed class name segments.
Space-separated prefixed class string.
Protected_destroyDestroys the canvas.
Protected_emitEmits a callback event with a fixed payload.
Set default mutable props
Device Pixel Ratio (DPR). Use 'auto' for automatic detection.
Canvas height. Use 'auto' to match the container's height.
Defines how the media element is positioned within the canvas.
Canvas width. Use 'auto' to match the container's width.
Get default static props
If true, appends the canvas to the container. Ignored if container is null.
If true, video elements will automatically render on each frame update.
Parent element used to determine canvas size. If null, it uses the viewport.
The media element to be rendered. Accepts a Canvas instance or common media elements like images and videos.
Debounce time (ms) for resize handling.
Automatically adjusts canvas size on initialization.
Enables dynamic resizing based on viewport or container changes.
Defines which dimension(s) should trigger a resize.
Protected_handleAdds 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.
Registers a function to run when the instance is destroyed.
If the instance is already destroyed, action runs immediately.
Cleanup function (for example remove listeners or DOM classes).
Pre-renders the media resource onto the canvas.
Resize the canvas
The
CanvasMediaclass 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