Populating objects from Tiler JSON

Phaser 3
1

Hi, everyone. First week using Phaser, so I apologize for any uber-newber questions I may be asking.

I have managed to populate my scene with the tileset from a json I made in tiler. So far so good.
I can’t
function preload(){
this.load.tilemapTiledJSON(‘map1’,‘dist/assets/tile/phaser-proj.json’)
}

    function create ()
    {

        const map1 = this.make.tilemap({key: "map1"});
        const tileset = map1.addTilesetImage("overworld", "overworld");
        const worldLayer = map1.createStaticLayer("ground", tileset, 0, 0);

Within that json there is another layer referencing objects in the world. I can’t seem to populate the world with said objects.

Also, I’m a bit confused as to what to do next in order to get that group of objects to collaborate with
this.physics.add.overlap to make them act like the objects they are (coins, in this case).

My testing overlap works fine. I can run my player sprite over the coins when I toss them out as

   coins = this.physics.add.group({
        key: 'coin',
        repeat: 11,
        setXY: { x: 12, y: 0, stepX: 70 }
    });

As it shows in the basic tutorial. So my function to snatch the coins works, I can move my player sprite around the map, but I can’t populate the map with objects indicated in the json and, once I’ve populated the map as I need, I don’t know how to add the newly populated coins to a group that can be overlapped by the player.

Thanks for your help. Really excited to work with Phaser!

2

If you haven’t already take a look at this:

https://labs.phaser.io/edit.html?src=src\game%20objects\tilemap\static\create%20from%20objects.js

3

Thanks. I’ll check it out and report back here with the results. It looks like just what I needed.

4

Worked like a charm! Unfortunately, I’ve been struggling mightily when it comes to turning the resulting sprites into physics objects.

I’ve looked at what seem to be relevant tutorials and pieces of the doc, but I’m at a loss.

5 
this.physics.world.enable(coins);

or

var group = this.physics.add.group({/* … */});

group.addMultiple(coins);
1 Like
6

Awesome. Thanks for helping a newb. I really appreciate it. I’ll try this and report back.

7

This worked perfectly, although I maddeningly had to hunt for other solutions because when I implemented that my browser decided to start only loading the cache, thus obfuscating the fact that I was not encountering the same error repeatedly despite changing code but that I was, in fact, loading the same code. That was fun. But it worked! Thanks a million.