Tilemap with REST-API

Phaser 3
1

Hello,

I create a complex Spring Boot simulation with React and Phaser. The simulation can be configured by the user and saved within a session. I have a PNG file for the different tiles of the simulation (65x65 pixels for each tile). When the React component is mounted with the phaser engine, the Phaser.Game is initialized, the PNG file is loaded into the preload function, and the tilemap is loaded with

this.load.tilemapTiledJSON("map", "/environment/map");

If I understood it correctly, the JSON defines the complete tilemap. But I don’t understand how I’m supposed to be the structure of the JSON to be returned by this REST call.

My simulation consists of 3 layers:

  1. static background of walls / solids
  2. dynamic immovable elements to be set / removed by the simulation via websocket, but through which the moving figures can pass
  3. dynamic moving figures which are continuously changed via a web socket

I am working with phaser for the first time, so I need some help how to realize this project in detail.

Thank you a lot for help

Phil

2

tilemapTiledJSON expects a specific file format export from Tiled. Checkout this file from the Labs for an example structure.

3

@flashpixx I’ve written an article about working with Tilemap data returned from a REST API if you’re interested.

4

@jorbascrumps sorry for my late replay, I’m very busy at the moment, but this article seems to be great for me, so I will read it and try to build my application. Thanks a lot