Documentation
    Preparing search index...

    The Canvas2D is a double-buffered construct to help with drawing to a HTMLCanvasElement with best possible performance. We utilize an OffscreenCanvas with a OffscreenCanvasRenderingContext2D to draw frames and expect to render them back to the DOM in regular intervals.

    Hierarchy (View Summary)

    Index

    Constructors

    Properties

    Our back buffer.

    The canvas element we're interacting with.

    The configuration that was used for this canvas.

    Accessors

    • get height(): number

      Retrieves the height of the canvas.

      Returns number

      The height of the canvas.

    • get width(): number

      Retrieves the width of the canvas.

      Returns number

      The width of the canvas.

    Methods

    • Fills the entire back buffer with the given color.

      Parameters

      • color: number

        The color to fill the back buffer with.

      Returns void

    • Draws a slightly transparent, black rectangle over the canvas, and then reads the result back into the buffer.

      Parameters

      • color: number = ...

        The color to fade the buffer with. The alpha component of the color defines how strong the fade is. 0 is not at all, 255 makes it instantly black.

      Returns void

    • Returns the color of a pixel in the back buffer.

      Parameters

      • x: number

        The X coordinate to retrieve.

      • y: number

        The X coordinate to retrieve.

      Returns number

      The color of the pixel at the given local.

    • Draw FPS information onto the canvas.

      Parameters

      • frameTimes: number[]

        Durations of previous frame draws.

      • frameTime: number

        The duration of the previous frame draw.

      • timeDelta: number

        The time elapsed since the last frame.

      Returns void

    • Colors a pixel in the back buffer.

      Parameters

      • x: number

        The X coordinate to color.

      • y: number

        The Y coordinate to color.

      • color: number

        The color to place at the coordinate.

      Returns void