Skip to main content

Canvas

A canvas [[Graphic]] to provide an adapter between the 2D Canvas API and the [[ExcaliburGraphicsContext]].

The [[Canvas]] works by re-rastering a draw handler to a HTMLCanvasElement for every draw which is then passed to the [[ExcaliburGraphicsContext]] implementation as a rendered image.

Low performance API

Hierarchy

Index

Constructors

Properties

Accessors

Methods

Constructors

constructor

Properties

public_bitmap

_bitmap: HTMLCanvasElement

publicfiltering

filtering: ImageFiltering = null

readonlyid

id: number = ...

publiclineCap

lineCap: butt | round | square = 'butt'

publicopacity

opacity: number = 1

Gets or sets the opacity of the graphic, 0 is transparent, 1 is solid (opaque).

publicquality

quality: number = 1

publicshowDebug

showDebug: boolean = false

Gets or sets wether to show debug information about the graphic

publictint

tint: Color = null

publictransform

transform: AffineMatrix = ...

Accessors

publiccolor

  • Gets or sets the fillStyle of the Raster graphic. Setting the fillStyle will cause the raster to be flagged dirty causing a re-raster on the next draw.

    Returns Color

  • Parameters

    Returns void

publicctx

  • get ctx(): CanvasRenderingContext2D

  • Return the 2D graphics context of this canvas

    Returns CanvasRenderingContext2D

publicdirty

  • get dirty(): boolean

  • Gets whether the graphic is dirty, this means there are changes that haven't been re-rasterized

    Returns boolean

publicflipHorizontal

  • get flipHorizontal(): boolean
  • set flipHorizontal(value: boolean): void

  • Gets or sets the flipHorizontal, which will flip the graphic horizontally (across the y axis)

    Returns boolean

  • Parameters

    • value: boolean

    Returns void

publicflipVertical

  • get flipVertical(): boolean
  • set flipVertical(value: boolean): void

  • Gets or sets the flipVertical, which will flip the graphic vertically (across the x axis)

    Returns boolean

  • Parameters

    • value: boolean

    Returns void

publicheight

  • get height(): number
  • set height(value: number): void

  • Gets or sets the current height of the Raster graphic. Setting the height will cause the raster to be flagged dirty causing a re-raster on the next draw.

    Any padding or quality set will be factored into the height

    Returns number

  • Parameters

    • value: number

    Returns void

publiclineDash

  • get lineDash(): number[]
  • set lineDash(value: number[]): void

  • Returns number[]

  • Parameters

    • value: number[]

    Returns void

publiclineWidth

  • get lineWidth(): number
  • set lineWidth(value: number): void

  • Gets or sets the line width of the Raster graphic. Setting the lineWidth will cause the raster to be flagged dirty causing a re-raster on the next draw.

    Returns number

  • Parameters

    • value: number

    Returns void

publiclocalBounds

  • Returns the local bounds of the Raster including the padding

    Returns BoundingBox

publicorigin

  • Gets or sets the origin of the graphic, if not set the center of the graphic is the origin

    Returns Vector

  • Parameters

    Returns void

publicpadding

  • get padding(): number
  • set padding(value: number): void

  • Returns number

  • Parameters

    • value: number

    Returns void

publicrotation

  • get rotation(): number
  • set rotation(value: number): void

  • Gets or sets the rotation of the graphic

    Returns number

  • Parameters

    • value: number

    Returns void

publicscale

  • Gets or sets the scale of the graphic, this affects the width and

    Returns Vector

  • Parameters

    Returns void

publicsmoothing

  • get smoothing(): boolean
  • set smoothing(value: boolean): void

  • Gets or sets the smoothing (anti-aliasing of the graphic). Setting the height will cause the raster to be flagged dirty causing a re-raster on the next draw.

    Returns boolean

  • Parameters

    • value: boolean

    Returns void

publicstrokeColor

  • get strokeColor(): Color
  • set strokeColor(value: Color): void

  • Gets or sets the strokeStyle of the Raster graphic. Setting the strokeStyle will cause the raster to be flagged dirty causing a re-raster on the next draw.

    Returns Color

  • Parameters

    Returns void

publicwidth

  • get width(): number
  • set width(value: number): void

  • Gets or sets the current width of the Raster graphic. Setting the width will cause the raster to be flagged dirty causing a re-raster on the next draw.

    Any paddings or quality set will be factored into the width

    Returns number

  • Parameters

    • value: number

    Returns void

Methods

publicclone

  • Returns a new instance of the graphic that has the same properties

    Returns Canvas

publiccloneGraphicOptions

publiccloneRasterOptions

publicdraw

  • Draw the whole graphic to the context including transform

    Parameters

    Returns void

execute

  • execute(ctx: CanvasRenderingContext2D): void

  • Executes drawing implementation of the graphic, this is where the specific drawing code for the graphic should be implemented. Once rasterize() the graphic can be drawn to the [[ExcaliburGraphicsContext]] via draw(...)

    Parameters

    • ctx: CanvasRenderingContext2D

      Canvas to draw the graphic to

    Returns void

publicflagDirty

  • flagDirty(): void

  • Flags the graphic as dirty, meaning it must be re-rasterized before draw. This should be called any time the graphics state changes such that it affects the outputted drawing

    Returns void

publicisStale

  • isStale(): boolean

  • Returns boolean

publicrasterize

  • rasterize(): void

  • Rasterize the graphic to a bitmap making it usable as in excalibur. Rasterize is called automatically if the graphic is [[Raster.dirty]] on the next [[Graphic.draw]] call

    Returns void