TiledWrapper

The TiledWrapper component wraps a tilemap exported from the Tiled map editor and selects which layer to render. It works together with a TilemapRenderer on the same entity, which draws the tiles using a tileset.

Note: Only orthogonal Tiled maps are supported.

Options

OptionTypeDescription
tilemapTiledTilemap | stringThe Tiled map data, as a parsed object or an asset URL/name string of a loaded JSON.
layerToRenderstringThe name of the Tiled layer to render.

Example

import { Transform, TiledWrapper, TilemapRenderer } from "angry-pixel";

this.entityManager.createEntity([
    new Transform(),
    new TiledWrapper({ tilemap: "map.json", layerToRender: "Ground" }),
    new TilemapRenderer({
        layer: "Foreground",
        tileset: {
            image: this.assetManager.getImage("tileset.png"),
            width: 8,
            tileWidth: 16,
            tileHeight: 16,
        },
    }),
]);

The Tiled JSON is loaded through the asset manager with loadJson, typically in the scene’s loadAssets method. See TilemapRenderer for the tileset configuration.