Tileset with gaps produces incorrect .json

[Christian-Broomfield]

Original issue filed in Tiled: mapeditor/tiled#831

Project used to reproduce problem described below: https://github.com/SoulBeaver/broken-tiled-tilemap2

Tiled screen:

Rendering using phaser-tiled plugin:

Rendering using vanilla phaser:

The .json for this tilemap

It turns out that Tiled has the correct ids in the tile layer, but Phaser is displaying an incorrect sprite.

Example:

The first tile in the tilemap is a corner bush with id 857; the tiled .json has 858, which is okay because the firstgid is 1. Phaser instead renders the broken bush, which is 842. We're off by 15. This makes my previous assessment of phaser missing one index per row. The bush in the tilemap is in the 15th row, so we've omitted 15 IDs.

I also have a second project in TypeScript using a smaller Tilemap.

[pnstickne]

@SoulBeaver This problem is caused because the tileset image provided is not a multiple of the tilesize (after the, not relevant in this case, margin/spacing is accounted for).

Phaser uses the equivalent of round(imageWidth / tileWidth) while it appears Tiled uses floor(imageWidth / tileWidth) (probably just integer division in C) when determining the Tile ID offset values. This issue should not be present (well, the entire map data will need to be re-plotted in Tiled) if resizing the tileset image to a proper multiple of the tilewidth before using it in Tiled.

(Note how the last row/column is not shown in Tiled when it is not an even multiple.)

This problem of using the non-multiple image size can be fixed / aligned with Tiled by changing Math.round to Math.floor in https://github.com/photonstorm/phaser/blob/master/src/tilemap/Tileset.js

I'm working on a patch (as it would align better with Tiled behavior), but I'm ultimately putting the "blame" on the source image dimensions - tsk, tsk missing pixels.

[pnstickne]

@SoulBeaver Thanks for the detailed reproduction case, it made it easy to track down the issue.

[photonstorm]

"Fixed" in dev.