Tiled map JS parser

Phaser 3
1

Hi! I’m working on a Node.js project Phaser 3 + Colyseus and I need to parse Tiled map files from my backend server. I need access to object positions and their metadata because players in the game will interact with specific objects/zones and I need to give access for specific actions.
I’ve tried parse-tmx, but objects proprieties are not parsed.

2

So you’re trying to parse the tmx (XML) file server side? Why not just parse it with any Node compatible XML parser?

3

I was hoping it was something ready-made, but then I’ll make my own JSON parser.

4

If you save the Tiled data as JSON, you don’t need to parse it since you already have an object. Something like this?

mymap = {
  "compressionlevel": -1,
  "height": 1,
  "infinite": false,
  "layers": [
    {
      "data": [0],
      "height": 1,
      "id": 1,
      "name": "Tile Layer 1",
      "opacity": 1,
      "type": "tilelayer",
      "visible": true,
      "width": 1,
      "x": 0,
      "y": 0
    },
    {
      "draworder": "topdown",
      "id": 2,
      "name": "Object Layer 1",
      "objects": [],
      "opacity": 1,
      "properties": [
        {
          "name": "foo",
          "type": "string",
          "value": "bar"
        }
      ],
      "type": "objectgroup",
      "visible": true,
      "x": 0,
      "y": 0
    }
  ],
  "nextlayerid": 3,
  "nextobjectid": 1,
  "orientation": "orthogonal",
  "renderorder": "right-down",
  "tiledversion": "1.9.2",
  "tileheight": 32,
  "tilesets": [],
  "tilewidth": 32,
  "type": "map",
  "version": "1.9",
  "width": 1
};

const props = mymap.layers[1].properties;
const fooProp = props.find(p => p.name === "foo");
console.log(fooProp?.value);
1 Like
5

Yes, in my case i just need to get the objects and their proprieties.
I already have some helper functions for extracting properties. Now I just need to retrieve all objects from all of my object layers. I will do it by myself.

 {
         "draworder":"topdown",
         "id":22,
         "name":"open-door",
         "objects":[
                {
                 "gid":5879,
                 "height":120,
                 "id":24,
                 "name":"",
                 "properties":[
                        {
                         "name":"isOpen",
                         "type":"bool",
                         "value":true
                        }, 
                        {
                         "name":"zindex",
                         "type":"int",
                         "value":20
                        }, 
                        {
                         "name":"zoneId",
                         "type":"int",
                         "value":2
                        }],
                 "rotation":0,
                 "type":"door",
                 "visible":true,
                 "width":120,
                 "x":560,
                 "y":880
                }],
         "opacity":1,
         "type":"objectgroup",
         "visible":true,
         "x":0,
         "y":0
        }, 
        {
         "draworder":"topdown",
         "id":28,
         "locked":true,
         "name":"zones",
         "objects":[
                {
                 "gid":141,
                 "height":680,
                 "id":30,
                 "name":"",
                 "properties":[
                        {
                         "name":"id",
                         "type":"int",
                         "value":1
                        }],
                 "rotation":0,
                 "type":"zone",
                 "visible":true,
                 "width":600,
                 "x":590,
                 "y":690
                }, 
                {
                 "gid":141,
                 "height":490,
                 "id":31,
                 "name":"",
                 "properties":[
                        {
                         "name":"id",
                         "type":"int",
                         "value":2
                        }],
                 "rotation":0,
                 "type":"zone",
                 "visible":true,
                 "width":600,
                 "x":590,
                 "y":1190
                }],
         "opacity":0.13,
         "type":"objectgroup",
         "visible":true,
         "x":0,
         "y":0
        },