Reference

Objects

TileMaps

All Maps properties are accessible (and editable) through the TileMaps object.

console.log(TileMaps)

Object { desert: {…}, hexagonal: {…}, isometric: {…} }

console.log(TileMaps["desert"])

Object { compressionlevel: -1, height: 40, infinite: false, layers: (1) […], nextlayerid: 2, nextobjectid: 1, orientation: "orthogonal", renderorder: "right-down", tiledversion: "1.7.2", tileheight: 32, … }

console.log(TileMaps["desert"].layers.length)

1

console.log(TileMaps["desert"].layers[0])

Object { data: (1600) […], height: 40, id: 1, name: "Ground", opacity: 1, type: "tilelayer", visible: true, width: 40, x: 0, y: 0 }

Methods

loadTiledMap

param  {String}   mapName               Map name.
param  {String}   [imagePath]           Path to the image file(s). Default: "/".
param  {Number}   [transparentOffset]   Maximum difference on RGB channels to apply Tile transparency. Default: 4.
param  {Function} [callback]            Name of a function to call once map loads.
return {p5.TiledMap}

function preload() {
  tmap = loadTiledMap("desert", "data");
}

Draw Methods

draw

draw() draws a TiledMap.

• Layer Visible property is respected.
• Opacity is ignored.
• The use of a off-screen graphics buffer is optional.
• Canvas (or the off-screen graphics buffer) IS NOT CLEARED BEFORE.

param  {Number}   camLeft               Left Coordinate.
param  {Number}   camTop                Top Coordinate.
param  {Object}   [pg]                  Off-screen graphics buffer.

function draw() {
  background(128);
  tmap.draw(0, 0);
}

drawLayer

drawLayer() draws a TiledMap Layer.

• Visible property is ignored when drawing individual layers.
• The use of a off-screen graphics buffer is optional. Can be used for extra image editing or if you want to use the layer opacity property (which is ignored when drawing to canvas).
• Canvas (or the off-screen graphics buffer) IS NOT CLEARED BEFORE (that's up to you).
• That means you can draw several layers on a buffer, but the layer opacity will affect all layers drawn before.

param  {Number}   layer                 Layer Index.
param  {Number}   camLeft               Left Coordinate.
param  {Number}   camTop                Top Coordinate.
param  {Object}   [pg]                  Off-screen graphics buffer.

function draw() {
  tmap.drawLayer(0, 0, 0);
}

setDrawMode

Define the meaning of draw and drawLayer coordinates. By default, they are camLeft and camTop - the left/top coordinates of the camera, but with setDrawMode(CENTER), they become the coordinates of the camera center.

param  {Constant} mode                 CORNER or CENTER

getDrawMode

return {Constant} mode                 CORNER or CENTER. Default: CORNER.

setPositionMode

Define the meaning of draw and drawLayer coordinates. By default, the coordinates are read as pixel position but with setPositionMode("MAP"), they become Tiles Coordinates.

param  {String}   mode                 "CANVAS" or "MAP".

getPositionMode

return {String}   mode                 "CANVAS" or "MAP". Default: "CANVAS".

setDrawMargin

param {Number}  margin               Number of tiles to be draw in excess around Canvas. Default: 2.

getDrawMargin

return {Number}   margin               Number of tiles to be draw in excess around Canvas. Default: 2.

Camera Methods

getCamCorner

Depending on positionMode, returns the Map (Tile) or Canvas (Pixels) coordinates.

return {p5.Vector}                     Left Top Corner Coordinates

getCamCenter

Depending on positionMode, returns the Map (Tile) or Canvas (Pixels) coordinates.

return {p5.Vector}                     Center Coordinates

getPosition

Depending on drawMode, returns the camera corner or center coordinates.

Depending on positionMode, returns the Map (Tile) or Canvas (Pixels) coordinates.

Essentially, you get the coordinates of last draw.

return {p5.Vector}

getCamSize

return {p5.Vector}                     Camera (last used Canvas) Width and Height

setCamSize

Only useful for some pre-draw calculations using Conversion Methods, since Cam size is always the last Canvas used to draw.

param  {P5.Vector}   (width, height)

param  {Number}   width
param  {Number}   height

Map Helper Methods

Maps are stored and accessible in TiledMaps Object. These are helper methods to ease Map and Layer management.

getName

return {String}                       Map Name

getVersion

return {Number}                        Map Version

getOrientation

return {String}                        Map Orientation

getBackgroundColor

return {Array}                         P5 Color

getMapSize

return {p5.Vector}                     Map Width and Height (in number of tiles)

getTileSize

return {p5.Vector}                     Tile Width and Height (in pixels)

getHexSideLength

return {Number}                        Only for Hexagonal Maps

Layer Helper Methods

getType

param  {Number}   layer                 Layer Index.
return {String}                         Returns Layer Type ("tilelayer", "imagelayer" or "objectgroup").

setVisible

param  {Number}   layer                 Layer Index.
param  {Boolean}  visible               Visible value.

getVisible

param  {Number}   layer                 Layer Index.
return {Boolean}                        Returns Layer Visibility.

setOpacity

param  {Number}   layer                 Layer Index.
param  {Number}   opacity               Opacity of the Layer (between 0 and 1).

getOpacity

param  {Number}   layer                 Layer Index.
return {Number}                         Opacity of a Layer (between 0 and 1).

getImage

param  {Number}   layer                 Layer Index.
return {p5.Image}                       Image of a Image Layer.

getObjects

param  {Number}   layer                 Layer Index.
return {Array}                          Array of Objects on a Object Layer.

getObjectsColor

param  {Number}   layer                 Layer Index.
return {Array}                          P5 Color of an Object Layer. Default: Black.

getData

param  {Number}   layer                 Layer Index.
return {Array}                          Data of a Tile Layer.

getCustomProperties

param  {Number}   layer                 Layer Index.
return {Object}                         Custom Properties of a Layer.

Tile Helper Methods

setTileIndex

setTileIndex changes a tile index. Remember that:

• x, y and t are Integers.
• 0 is an empty tile.
• The stored tile index is the index presented by Tiled +1.

param  {Number}   layer                 Layer Index.
param  {Number}   x                     Horizontal Coordinate.
param  {Number}   y                     Vertical Coordinate.
param  {Number}   t                     Tile Index.

param  {Number}   layer                 Layer Index.
param  {p5.Vector}   v                  Coordinates.
param  {Number}   t                     Tile Index.

getTileIndex

getTileIndex return the tile index. Remember that:

• x and y are Integers.
• 0 is an empty tile.
• The stored tile index is the index indicated by Tiled +1.

param  {Number}   layer                 Layer Index.
param  {Number}   x                     Horizontal Coordinate.
param  {Number}   y                     Vertical Coordinate.
return {Number}                         Tile Index.

param  {Number}   layer                 Layer Index.
param  {p5.Vector}   v                  Coordinates.
return {Number}                         Tile Index.

Conversion Methods

Conversion Methods between the 3 coordinate systems in use: MAP (Tile coordinates), CANVAS (Pixel coordinates) and CAM (relative coordinates of the draw).

canvasToMap

param  {Number}   x                     Canvas Horizontal Coordinate.
param  {Number}   y                     Canvas Vertical Coordinate.
return {p5.Vector}                      Map Coordinates

param  {p5.Vector}   v                  Canvas Coordinates.
return {p5.Vector}                      Map Coordinates

mapToCanvas

param  {Number}   x                     Map Horizontal Coordinate.
param  {Number}   y                     Map Vertical Coordinate.
return {p5.Vector}                      Canvas Coordinates

param  {p5.Vector}   v                  Map Coordinates.
return {p5.Vector}                      Canvas Coordinates

camToCanvas

param  {Number}   x                     Cam Horizontal Coordinate.
param  {Number}   y                     Cam Vertical Coordinate.
return {p5.Vector}                      Canvas Coordinates

param  {p5.Vector}   v                  Cam Coordinates.
return {p5.Vector}                      Canvas Coordinates

canvasToCam

param  {Number}   x                     Canvas Horizontal Coordinate.
param  {Number}   y                     Canvas Vertical Coordinate.
return {p5.Vector}                      Cam Coordinates

param  {p5.Vector}   v                  Canvas Coordinates.
return {p5.Vector}                      Cam Coordinates

camToMap

param  {Number}   x                     Cam Horizontal Coordinate.
param  {Number}   y                     Cam Vertical Coordinate.
return {p5.Vector}                      Map Coordinates

param  {p5.Vector}   v                  Cam Coordinates.
return {p5.Vector}                      Map Coordinates

mapToCam

param  {Number}   x                     Map Horizontal Coordinate.
param  {Number}   y                     Map Vertical Coordinate.
return {p5.Vector}                      Cam Coordinates

param  {p5.Vector}   v                  Map Coordinates.
return {p5.Vector}                      Cam Coordinates