Skip to content

Tiled map support

dgcor edited this page May 15, 2021 · 4 revisions

Tiled map support

DGEngine as of v0.2.0 supports loading of TMX maps (saved as JSON) created with Tiled.

Tiled - http://www.mapeditor.org/

tiled tiled2

Here is a zip file with a few examples: Tiled maps.zip

Texture images are not included for obvious reasons. only L1 textures are included, but modified (blurred) to avoid distributing copyrighted material.

Exporting textures for Tiled

To export textures for use in Tiled maps, you can use the function defined in LevelHelper.h

	// bottomTopOrBoth : -1 for both, 0 for bottom, 1 for top
	void saveTilesetSprite(const std::string& path,
		CachedImagePack& imgPack, Min& min, int bottomTopOrBoth, bool skipBlankTiles);
...

	// exports images for Tiled
	LevelHelper::saveTilesetSprite("C:\\images\\", imgPack, min, -1, false);

I recommend calling this function in ParseTexturePack.cpp right before the LevelHelper::loadTilesetSprite function.

Loading Tiled maps

This is how DGEngine loads the town map right now using dun files:

{
  "level": {
    "id": "level",
    "name": "Town Center",
    "palette": "town",
    "file": "Nlevels/TownData/Town.CEL",
    "mapSize": [96, 96],
    "map": [
      { "file": "levels/towndata/sector1s.dun", "position": [46, 46] },
      { "file": "levels/towndata/sector2s.dun", "position": [46, 0] },
      { "file": "levels/towndata/sector3s.dun", "position": [0, 46] },
      { "file": "levels/towndata/sector4s.dun", "position": [0, 0] }
    ],
    "til": "Nlevels/TownData/Town.TIL",
    "min": "Nlevels/TownData/Town.MIN",
    "minBlocks": 16,
    "sol": "Nlevels/TownData/Town.SOL"
  },
  "load": "level/town/levelObjects.json",
  "load": "level/town/items.json"
}

This is how you would load the Tiled map town.json:

Note we no longer need the til file.

{
  "level": {
    "id": "level",
    "name": "Town Center",
    "palette": "town",
    "file": "Nlevels/TownData/Town.CEL",
    "mapSize": [96, 96],
    "map": { "file": "level/town/town.json", "position": [0, 0], "indexOffset": -1 },
    "min": "Nlevels/TownData/Town.MIN",
    "minBlocks": 16,
    "sol": "Nlevels/TownData/Town.SOL"
  },
  "load": "level/town/levelObjects.json",
  "load": "level/town/items.json"
}

Edit: to support loading Tiled map files from Flare (indexes start at 1), and since tile indexes in diablo start at 0, indexOffset was added to shift the indexes. To load tiled maps for Diablo, add -1 to the indexes.

A Tiled map contains more information than what DGEngine uses. We only load the data array with the indexes and the width/height of the map.

{ "backgroundcolor":"#000000",
 "height":96,
 "infinite":false,
 "layers":[
        {
         "data":[218, 26, 282, 283, 290, 291, 17, ...],
         "height":96,
         "name":"Tile Layer 1",
         "opacity":1,
         "type":"tilelayer",
         "visible":true,
         "width":96,
         "x":0,
         "y":0
        }],
 "nextobjectid":1,
...

Flare Tiled maps

This is how we load town using flare game files:

"level": {
  "id": "level",
  "name": "Town Center",
  "texturePackBottom": "levelBack",
  "texturePackTop": "levelBack",
  "map": {
    "file": "level/town/frontier_outpost.json",
    "back": "background",
    "front": "object",
    "sol": "collision"
  }
},
  • Back - name of the background layer
  • front - name of the foreground layer
  • sol - name of the collision layer - flare uses a layer to determine if a tile is passable or not