TileLayers. CanvasLayer

Canvas Layer - cached off screen rendering system

  • Contains an offscreen canvas that can be rendered to
  • WebGL rendering is optional, call updateWebGL to enable/update
  • A TileLayer using WebGL redraws into its texture and leaves this canvas blank, so drawing on its context only shows on a layer made with useWebGL=false (or with WebGL off); use drawLayerTile/drawLayerRect inside redrawStart/End for drawing that works both ways

Constructor

new CanvasLayer(posopt, sizeopt, angleopt, renderOrderopt, canvasSizeopt, useWebGLopt)

Create a canvas layer object

Parameters:
NameTypeAttributesDefaultDescription
posVector2<optional>

World space position of the layer

sizeVector2<optional>

World space size of the layer

anglenumber<optional>
0

Angle the layer is rotated by

renderOrdernumber<optional>
0

Objects sorted by renderOrder

canvasSizeVector2<optional>

Default size of canvas, can be changed later

useWebGLboolean<optional>
true

Should this layer use WebGL for rendering

Source
Example
const canvasLayer = new CanvasLayer(vec2(), vec2(200,100));

Extends

  • EngineObject

Members

canvas

Properties
TypeDescription
OffscreenCanvas

The canvas used by this layer

Source

context

Properties
TypeDescription
OffscreenCanvasRenderingContext2D

The 2D canvas context used by this layer

Source

textureInfo

Properties
TypeDescription
TextureInfo

Texture info to use for this object rendering

Source

Methods

destroy(immediateopt)

Destroy this canvas layer

Parameters:
NameTypeAttributesDefaultDescription
immediateboolean<optional>
false

Remove it now, as EngineObject.destroy does, children included

Source

draw(pos, sizeopt, coloropt, angleopt, mirroropt, additiveColoropt, screenSpaceopt, contextopt)

Draw this canvas layer centered in world space

Parameters:
NameTypeAttributesDefaultDescription
posVector2

Center in world space

sizeVector2<optional>

Size in world space

colorColor<optional>

Color to modulate with

anglenumber<optional>
0

Angle to rotate by

mirrorboolean<optional>
false

If true image is flipped along the Y axis

additiveColorColor<optional>

Additive color to be applied if any

screenSpaceboolean<optional>
drawScreenSpace

If true the pos and size are in screen space

contextCanvasRenderingContext2D | OffscreenCanvasRenderingContext2D<optional>

Canvas 2D context to draw to

Source

hasWebGL() → {boolean}

Check if this layer is using WebGL

Source
Returns:
Type: 
boolean

updateWebGL()

Create WebGL texture if necessary and copy layer canvas to it

Source