Which format to use with javascript/JSON file

Questions
1

Hello there,
I have a trouble understanding how to load/decode my tilemap with javascript/JSON.
I create a new map as base64 and save it as a json file. I am not sure how to load this into an 2d array.

When I tried to decode a string I got some black boxes with question mark as a result which is confusing me even more :expressionless:
I am not using phaser since I am trying to make my own game from scratch, this way I will understand how its made from a scratch.
Thanks for your help :slight_smile:

2

You can read about what to do with the base64 encoded data on the TMX Map Format page. This data is exactly the same in the JSON format.

However, you may be much better off just choosing “CSV” layer data format, in which case the JSON map format will include the tile layer data as a basic JSON array.

3

Hey I think that I am using csv format which result in a big array which I convert into 2d array in my code. Thanks for the help :slight_smile:

4

I don’t think there’s any advantage in converting this array into a 2d array. You could just use a function like this, which is what Tiled is doing:

function tileAt(x, y) {
    return tiles[x + y * width];
}
5

Hey thanks for the code, but I am not sure how its supposed to work. Can you give me an example? Width is the width of my whole map? x and y are coords from my loop? I understand that I am supposed to draw my map starting with each column? Currently I am drawing each row, from left to right, when I reach the end I start from the new row, but your code should work only if I draw from top to bottom. Tell me if I understand it right or if you dont understand me :stuck_out_tongue:

6

Right, that would be the map width, or the width of the tile layer more specifically.

They are the x and y coordinates of the tile you want to access. While drawing tiles, they will indeed be from your loop.

I think you didn’t understand me. My code snippet was only to demonstrate an alternative to doing tiles[y][x], using a small function to index a 1-dimensional tiles array instead. It has nothing to do with drawing order.

7

Thanks for the info :slight_smile: I will try to use this in my code then.