# Load tileset images from tilemap

**URL:** <https://phaser.discourse.group/t/load-tileset-images-from-tilemap/11600>\
**Category:** Examples\
**Created:** [April 26, 2022, 2:35pm UTC](https://phaser.discourse.group/t/load-tileset-images-from-tilemap/11600 "2022-04-26T14:35:48Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![samme](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/samme/32/5275_2.png) [@samme](https://phaser.discourse.group/u/samme)\
**Post date:** [April 26, 2022, 2:35pm UTC](https://phaser.discourse.group/t/load-tileset-images-from-tilemap/11600/1 "2022-04-26T14:35:48Z")

</div>

It took me a few years to figure this out.

```javascript
this.load.tilemapTiledJSON("map", "assets/tilemaps/maps/multi-tileset-v12.json");

this.load.once(
  "filecomplete-tilemapJSON-map",
  function (key, type, data) {
    this.load.setPath("/assets/tilemaps/maps/");

    for (var tileset of data.data.tilesets) {
      this.load.image(tileset.name, tileset.image);
    }
  },
  this
);

```

You can also add tilesets and layers directly from the map data:

```javascript
var map = this.add.tilemap("map");

for (var tileset of map.tilesets) {
  map.addTilesetImage(tileset.name);
}

for (var layerData of map.layers) {
  map.createLayer(layerData.name, map.tilesets);
}

```

https://codepen.io/samme/embed/preview/ZEvdzMe?default-tabs=js%2Cresult&height=300&host=https%3A%2F%2Fcodepen.io&slug-hash=ZEvdzMe