Skip to main content

ExcaliburGraphicsContext

Implemented by

Index

Properties

backgroundColor

backgroundColor: Color

Set the background color of the graphics context, default is Color.ExcaliburBlue

debug

debug: DebugDraw

Access the debug drawing api

height

height: number

material

material: Material | null | undefined

Gets or sets the material to be used in the current context's drawings

This allows customs shaders to be used but draw calls are no longer batched by default.

@param

opacity

opacity: number

Sets the opacity of the current Graphic being drawn, default is 1

smoothing

smoothing: boolean

Enable smoothed drawing (also known as anti-aliasing), by default true

snapToPixel

snapToPixel: boolean

Snaps all drawings to the nearest pixel truncated down, by default false

tint

tint: Color | null | undefined

Sets the tint color to be multiplied by any images drawn, default is black 0xFFFFFFFF

useDrawSorting

useDrawSorting: boolean

Excalibur will automatically sort draw calls by z and priority for maximal draw performance, this can disrupt a specific desired painter order.

To force a specific draw call order, use ExcaliburGraphicsContext.z

By default useDrawSorting is true, to opt out set this to false

width

width: number

z

z: number

Set the current z context for the graphics context. Draw calls issued to the context will use this z to inform their sort order.

Note it is important to all ExcaliburGraphicsContext.save and ExcaliburGraphicsContext.restore when modifying state.

Methods

addPostProcessor

  • Add a post processor to the graphics context

    Post processors are run in the order they were added.


    Parameters

    Returns void

beginDrawLifecycle

  • beginDrawLifecycle(): void
  • Returns void

clear

  • clear(): void
  • Clears the screen with the current background color


    Returns void

clearPostProcessors

  • clearPostProcessors(): void
  • Remove all post processors from the graphics context


    Returns void

createMaterial

  • Creates and initializes the material which compiles the internal shader


    Parameters

    Returns Material

dispose

  • dispose(): void
  • Returns void

draw

  • draw<TRenderer>(rendererName: TRenderer[type], ...args: Parameters<TRenderer[draw]>): void
  • Issue a draw command to a named renderer plugin.

    The renderer is looked up by name (auto-instantiating lazy renderers) and its draw() method is called with the provided arguments. Draw calls are sorted by z-index and renderer priority before flushing.

    In the Canvas 2D fallback context this is a no-op.


    Type parameters

    Parameters

    • rendererName: TRenderer[type]

      The unique renderer type name to draw with

    • rest...args: Parameters<TRenderer[draw]>

      Arguments forwarded to the renderer's draw() method

    Returns void

drawCircle

  • drawCircle(pos: Vector, radius: number, color: Color, stroke?: Color, thickness?: number): void
  • Draw a circle to the Excalibur Graphics context


    Parameters

    • pos: Vector
    • radius: number
    • color: Color
    • optionalstroke: Color

      Optionally specify the stroke color

    • optionalthickness: number

    Returns void

drawImage

  • drawImage(image: HTMLImageSource, x: number, y: number): void
  • drawImage(image: HTMLImageSource, x: number, y: number, width: number, height: number): void
  • drawImage(image: HTMLImageSource, sx: number, sy: number, swidth?: number, sheight?: number, dx?: number, dy?: number, dwidth?: number, dheight?: number): void
  • Draw an image to the Excalibur Graphics context at an x and y coordinate using the images width and height


    Parameters

    Returns void

drawLine

  • Draw a solid line to the Excalibur Graphics context


    Parameters

    Returns void

drawRectangle

  • drawRectangle(pos: Vector, width: number, height: number, color: Color, stroke?: Color, strokeThickness?: number): void
  • Draw a solid rectangle to the Excalibur Graphics context


    Parameters

    • pos: Vector
    • width: number
    • height: number
    • color: Color
    • optionalstroke: Color
    • optionalstrokeThickness: number

    Returns void

endDrawLifecycle

  • endDrawLifecycle(): void
  • Returns void

flush

  • flush(): void
  • Flushes the batched draw calls to the screen


    Returns void

get

  • Look up a registered renderer plugin by its type name.

    If the renderer was lazily registered, it will be instantiated and initialized on first access.


    Parameters

    • rendererName: string

      The unique renderer type name

    Returns RendererPlugin | undefined

    The renderer plugin, or undefined if not found

getTransform

lazyRegister

  • lazyRegister<TRenderer>(type: TRenderer[type], renderer: () => TRenderer): void
  • Lazily register a custom renderer plugin with the graphics context.

    The renderer factory is stored and only instantiated the first time it is requested via ExcaliburGraphicsContext.get. Use this for renderers that may not be needed in every game to avoid unnecessary initialization cost.

    In the Canvas 2D fallback context this is a no-op.


    Type parameters

    Parameters

    • type: TRenderer[type]

      The unique renderer type name (matches RendererPlugin.type)

    • renderer: () => TRenderer

      A factory function that creates the renderer

      Returns void

    multiply

    • Multiplies the current transform by a matrix


      Parameters

      Returns void

    register

    • register<T>(renderer: T): void
    • Register a custom renderer plugin with the graphics context.

      The renderer is immediately initialized with the WebGL context. Use this for renderers that should always be available.

      In the Canvas 2D fallback context this is a no-op.


      Type parameters

      Parameters

      • renderer: T

        The renderer plugin to register

      Returns void

    removePostProcessor

    • Remove a specific post processor from the graphics context


      Parameters

      Returns void

    resetTransform

    • resetTransform(): void
    • Resets the current transform to the identity matrix


      Returns void

    restore

    • restore(): void
    • Restore the state of the canvas from the stack


      Returns void

    rotate

    • rotate(angle: number): void
    • Rotate the context about the current origin


      Parameters

      • angle: number

      Returns void

    save

    • save(): void
    • Save the current state of the canvas to the stack (transforms and opacity)


      Returns void

    scale

    • scale(x: number, y: number): void
    • Scale the context by an x and y factor


      Parameters

      • x: number
      • y: number

      Returns void

    translate

    • translate(x: number, y: number): void
    • Translate the origin of the context by an x and y


      Parameters

      • x: number
      • y: number

      Returns void

    updateViewport

    • Update the context with the current viewport dimensions (used in resizing)


      Parameters

      Returns void