Renderer

Renderer

/**
 * Type of options of {@link Renderer}.
 */
type RendererOptions = Partial<{
    /**
     * The canvas element to use.
     * (If this is omitted, one will be created internally.)
     */
    canvas: HTMLCanvasElement;
    /**
     * Width of the view.
     * @default 480
     */
    width: number;
    /**
     * Height of the view.
     * @default 320
     */
    height: number;
    /**
     * Pixel ratio.
     * @default window.devicePixelRatio
     */
    ratio: number;
    /**
     * Whether to invoke `initialize` in constructor.
     * @default true
     */
    autoInitialize: boolean;
    /**
     * Whether to automatically set
     * the element style of the canvas.
     * @default true
     */
    autoStyle: boolean;
}>;

/**
 * Class of canvas 2D renderers.
 */
class Renderer {

    /**
     * Constructor of renderers.
     */
    constructor(options?: RendererOptions);

    /**
     * The canvas element in use.
     */
    readonly canvas: HTMLCanvasElement;

    /**
     * The 2D rendering context in use.
     */
    readonly context: CanvasRenderingContext2D;

    /**
     * Whether to automatically set
     * the element style of the canvas.
     * @default true
     */
    autoStyle: boolean;

    /**
     * Current pixel ratio.
     */
    get ratio(): number;

    /**
     * Current width of the view.
     */
    get width(): number;

    /**
     * Current height of the view.
     */
    get height(): number;

    /**
     * Get the client x of the canvas.
     * (Updated by `this.initialize`.)
     */
    get clientX(): number;

    /**
     * Get the client y of the canvas.
     * (Updated by `this.initialize`.)
     */
    get clientY(): number;

    /**
     * Get the scale x of the canvas positions.
     * (Updated by `this.initialize`.)
     */
    get scaleX(): number;

    /**
     * Get the scale y of the canvas positions.
     * (Updated by `this.initialize`.)
     */
    get scaleY(): number;

    /**
     * Resize the view.
     */
    resize(width: number, height: number, ratio?: number): void;

    /**
     * Initialize the renderer.
     */
    initialize(): void;

    /**
     * Get the corresponding x-offset in the canvas view
     * from the given x-offset in client view.
     */
    toViewX(clientX: number): number;

    /**
     * Get the corresponding y-offset in the canvas view
     * from the given y-offset in client view.
     */
    toViewY(clientY: number): number;
}