TileLayers. TileLayer

Tile Layer - cached rendering system for tile layers

  • Each Tile layer is rendered to an off screen canvas
  • To allow dynamic modifications, layers are rendered using canvas 2d
  • Some devices like mobile phones are limited to 4k texture resolution
  • For with 16x16 tiles this limits layers to 256x256 on mobile devices
  • Tile layers are centered on their corner, so normal levels are at (0,0)

Constructor

new TileLayer(pos, size, tileInfoopt, renderOrderopt, useWebGLopt)

Create a tile layer object

Parameters:
NameTypeAttributesDefaultDescription
posVector2

World space position

sizeVector2

World space size

tileInfoTileInfo<optional>

Default tile info for layer (used for size and texture)

renderOrdernumber<optional>
0

Objects are sorted by renderOrder

useWebGLboolean<optional>
true

Should this layer use WebGL for rendering

Example
const tileLayer = new TileLayer(vec2(), vec2(200,100));

Extends

  • CanvasLayer

Members

data

Properties
TypeDescription
Array.<TileLayerData>

Default tile info for layer

isUsingWebGL

Properties
TypeDescription
boolean

Is this layer using a webgl texture?

savedRenderSettings

tileInfo

Properties
TypeDescription
TileInfo

Default tile info for layer

Methods

clearData(layerPos, redrawopt)

Clear data at a given position in the array

Parameters:
NameTypeAttributesDefaultDescription
layerPosVector2

Local position in array

redrawboolean<optional>
false

Force the tile to redraw if true

clearLayerRect(pos, size)

Clear a rectangle in layer space

Parameters:
NameTypeDescription
posVector2

position in pixel coordinates

sizeVector2

drawLayerRect(pos, size, coloropt, angleopt)

Clear a rectangle in layer space

Parameters:
NameTypeAttributesDefaultDescription
posVector2
sizeVector2
colorColor<optional>
WHITE

Color to modulate with

anglenumber<optional>
0

Angle to rotate by

drawLayerTile(pos, sizeopt, tileInfoopt, coloropt, angleopt, mirroropt, additiveColoropt)

Draw textured tile in layer space

Parameters:
NameTypeAttributesDefaultDescription
posVector2

Position in pixel coordinates

sizeVector2<optional>
vec2(1)

Size of the tile

tileInfoTileInfo<optional>

Tile info to use, untextured if undefined

colorColor<optional>
WHITE

Color to modulate with

anglenumber<optional>
0

Angle to rotate by

mirrorboolean<optional>

Is image flipped along the Y axis?

additiveColorColor<optional>

Additive color to be applied if any

drawTileData(layerPos, clearopt)

Draw the tile at a given position in the tile layer This can be used to clear out tiles when they are destroyed Tiles can also be redrawn if inside a redrawStart/End block

Parameters:
NameTypeAttributesDefaultDescription
layerPosVector2
clearboolean<optional>
true

should the old tile be cleared out

getData(layerPos) → {TileLayerData}

Get data at a given position in the array

Parameters:
NameTypeDescription
layerPosVector2

Local position in array

Returns:
Type: 
TileLayerData

onRedraw()

Called after this layer is redrawn, does nothing by default

redraw()

Draw all the tile data to an offscreen canvas

  • This may be slow if not using webgl but only needs to be done once

redrawEnd()

Call to end the redraw process

redrawStart(clearopt)

Call to start the redraw process

  • This can be used to manually update parts of the level
Parameters:
NameTypeAttributesDefaultDescription
clearboolean<optional>
false

Should it clear the canvas before drawing

redrawTileData(layerPos, clearopt)

Draw the tile at a given position in the tile layer This can be used to clear tiles when they are destroyed For better performance use drawTileData inside a redrawStart/End block

Parameters:
NameTypeAttributesDefaultDescription
layerPosVector2
clearboolean<optional>
true

should the old tile be cleared

setData(layerPos, data, redrawopt)

Set data at a given position in the array

Parameters:
NameTypeAttributesDefaultDescription
layerPosVector2

Local position in array

dataTileLayerData

Data to set

redrawboolean<optional>
false

Force the tile to redraw if true