**Language / Langue :** [[fr:yaml:tuiles-tilemaps|FR]] | **EN**

====== Tiles And Tilemaps ======

Tiles extract one cell from a spritesheet. Tilemaps assemble several tiles into a grid, directly in the text or inside a persistent frame.

===== Extracting A Tile =====

<code yaml>
text: "Tile: [[/scenarios/images/test/tiles.png:4x4:1:2]]"
</code>

The complete form is %%[[url:NxM:col:row]]%%.

  * ''N'' is the number of columns in the spritesheet.
  * ''M'' is the number of rows in the spritesheet.
  * ''col'' and ''row'' are the tile coordinates, starting at 0.

Inside text, a tile is shown at its **real size**: it is never enlarged unless you ask for it. Only a tile too large for the text area is reduced. Clicking it enlarges only the selected cell, not the whole spritesheet.

The rule applies on every platform, including the attachment produced by Discord.

===== Building A Grid =====

<code yaml>
text: |
  [[grid:3x3]]
  /scenarios/images/test/tiles.png:4x4:0:0 | /scenarios/images/test/tiles.png:4x4:1:0 | /scenarios/images/test/tiles.png:4x4:2:0
  /scenarios/images/test/tiles.png:4x4:0:1 | /scenarios/images/test/tiles.png:4x4:1:1 | /scenarios/images/test/tiles.png:4x4:2:1
  /scenarios/images/test/tiles.png:4x4:0:2 | /scenarios/images/test/tiles.png:4x4:1:2 | /scenarios/images/test/tiles.png:4x4:2:2
  [[/grid]]
</code>

Each cell contains either an extracted tile with ''url:NxM:col:row'', or a direct picture URL. Cells are separated with ''|''.

===== Dynamic Variables =====

Coordinates can use variables between braces. This is useful for a minimap or HUD updated by events.

<code yaml>
frame: |
  [[grid:3x3]]
  /scenarios/images/test/tiles.png:4x4:0:0 | /scenarios/images/test/tiles.png:4x4:1:0 | /scenarios/images/test/tiles.png:4x4:2:0
  /scenarios/images/test/tiles.png:4x4:0:1 | /scenarios/images/test/tiles.png:4x4:{map_x}:{map_y} | /scenarios/images/test/tiles.png:4x4:2:1
  /scenarios/images/test/tiles.png:4x4:0:2 | /scenarios/images/test/tiles.png:4x4:1:2 | /scenarios/images/test/tiles.png:4x4:2:2
  [[/grid]]
</code>

Grids placed in ''frame:'' refresh with the room, like other persistent information.

===== Useful Behaviours =====

  * If the grid has fewer cells than expected, missing cells are filled with white placeholders.
  * If tiles with different sizes are mixed, the cell takes the size of the **smallest** one: a large picture is reduced to the tile format, instead of imposing its own.
  * Several cells may use the same spritesheet, including when it is already cached.
  * The linter reports incomplete grids.
  * On adapters that cannot display an interactive tilemap, a fallback rendering is used.