Class TilemapRenderer

The TilemapRenderer component renders 2D tile-based maps to the screen.
It uses a tileset image as a source for individual tiles, which are arranged according to a provided array of tile IDs.
The component supports features like tinting, masking, opacity control, and custom tile dimensions.
Maps can be rendered in chunks for improved performance with large tilemaps, and tiles can be assigned to specific render layers.
Each tile is referenced by an ID, with 0 representing empty space.

Example

const tilemapRenderer = new TilemapRenderer({
  layer: "Default",
  tileset: {
    image: this.assetManager.getImage("tileset.png"),
    width: 10,
    tileWidth: 32,
    tileHeight: 32,
    margin: new Vector2(0, 0),
    spacing: new Vector2(0, 0)
  },
  data: [1, 2, 3, 4],
  chunks: [],
  width: 2,
  height: 2,
  tileWidth: 32,
  tileHeight: 32,
  tintColor: "#FFFFFF",
  maskColor: "#FF0000",
  maskColorMix: 0,
  opacity: 1,
  smooth: false
});
Copy