Jump to content

How to use addTilesetImage with a map built from images collection


Dreadpoule
 Share

Recommended Posts

Hello there :)

 

I’ve built a map with Tiled with a tileset built from an images collection. So, I would to know how to load this tileset in my scene?

Here where I am in my code work:

export default class PreloadLevel1 extends Phaser.Scene {

    //...

    preload() {
        for (let i = 1; i < 101; i++) {
            const num = i.toString().padStart(3, '0');
            this.load.image('objects' + num, 'assets/img/tiles/objects' + num + '.png');
            this.load.image('tiles' + num, 'assets/img/tiles/tiles' + num + '.png');
        }
        this.load.tilemapTiledJSON('tileset', 'assets/json/levels/level1.json');
    }

    //...
}


export default class Level1 extends Phaser.Scene {
    
    //...

    create() {
        this.tilemap = this.make.tilemap({ key:'tileset' });

        for (let i = 1; i < 101; i++) {
            const num = i.toString().padStart(3, '0');
            this.tilesets.push(this.tilemap.addTilesetImage('tileset', 'objects' + num));
            this.tilesets.push(this.tilemap.addTilesetImage('tileset', 'tiles' + num));
        }

        //...
    }

    //...
}

But I finish with the warning in my console: No data found for Tileset: tileset

Here an extract of my level1.json file:

"tilesets":[
        {
         "columns":0,
         "firstgid":1,
         "grid":
            {
             "height":1,
             "orientation":"orthogonal",
             "width":1
            },
         "margin":0,
         "name":"tileset", // <----- there
         "spacing":0,
         "tilecount":173,
         "tileheight":64,

As you can see, the name of my tileset is right.

And another extract of this same file to see you how my tiles array is built:

    "tiles":[
                {
                 "id":404,
                 "image":"..\/..\/img\/tiles\/objects001.png",
                 "imageheight":17,
                 "imagewidth":13
                }, 
                {
                 "id":405,
                 "image":"..\/..\/img\/tiles\/objects002.png",
                 "imageheight":19,
                 "imagewidth":20
                }, 
                {
                 "id":406,
                 "image":"..\/..\/img\/tiles\/objects003.png",
                 "imageheight":35,
                 "imagewidth":22
                }, 
                {
                 "id":407,
                 "image":"..\/..\/img\/tiles\/objects004.png",
                 "imageheight":40,
                 "imagewidth":43

Is somebody to help me?

Link to comment
Share on other sites

 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...