@avolutions/canvas-painter/dist/esm/options/CanvasOptions.js

CanvasPainter.js is a simple yet powerful JavaScript library for drawing basic shapes (rectangles, circles, etc.) on HTML5 Canvas with ease. Perfect for creating 2D graphics in your web projects.

import { PanOptions } from "./PanOptions.js";
import { ZoomOptions } from "./ZoomOptions.js";
/**
 * Options for configuring the behavior of a canvas.
 */
export class CanvasOptions {
    /**
     * The width of the canvas in pixels.
     */
    width;
    /**
     * The height of the canvas in pixels.
     */
    height;
    /**
     * Determines whether interactivity is enabled for the canvas.
     */
    interactive;
    /**
     * Whether zooming is enabled on the canvas.
     */
    zoomable;
    /**
     * The options for configuring the zoom behavior of the canvas.
     */
    zoom;
    /**
     * Whether panning is enabled on the canvas.
     */
    pannable;
    /**
     * The options for configuring the pan behavior of the canvas.
     */
    pan;
    /**
     * Default canvas options.
     */
    static DefaultOptions = {
        width: 300,
        height: 150,
        interactive: true,
        zoomable: false,
        pannable: false,
        zoom: ZoomOptions.DefaultOptions,
        pan: PanOptions.DefaultOptions
    };
    /**
     * Creates a new instance of CanvasOptions.
     *
     * @param options - The partial options provided by the user.
     */
    constructor(options = {}) {
        // Handle partial ZoomOptions
        const zoomOptions = new ZoomOptions(options.zoom || {});
        // Handle partial PanOptions
        const panOptions = new PanOptions(options.pan || {});
        // Create the merged options
        const optionsWithDefaults = {
            ...CanvasOptions.DefaultOptions,
            ...options,
            zoom: zoomOptions, // Ensure zoom is correctly merged
            pan: panOptions, // Ensure pan is correctly merged
        };
        Object.assign(this, optionsWithDefaults);
    }
}