tiled-load

This lets you read tiled in javascript. It can handle JSON files, with all the different encoding options (zlib, gzip, base64, etc.)

It's meant to work in browser or node. It just loads the data in a normalized & easy-to-read format, and you can do whatever you want with it.

usage

There is only one function to use:

import tiled from 'tiled-load'

// give it a filename & prefix (relative location where the map is)
const map = await tiled('demo.tmj', './example/')

It has a loader (3rd param) that takes a filename, and will resolve it as a text-file. The default for that checks for fetch and if not found, uses readFile, but you can override that, if you need another behavior.

installation

There are a lot of ways to use tiled-load. If you are in an environment that can't import npm modules directly (like in a browser) use an import-map for pako (if you need compression support.) If you need base64 (compressed or uncompressed) you need atob, which will be installed in node, and already available in others (browsers, deno, etc.)

node

npm i tiled-load

Now, you can set "type": "module" in package.json and do this:

import tiled from 'tiled-load'

or commonjs:

const tiled = require('tiled-load')

browser

Use it directly with a CDN & import-map.

<script type="importmap">
{
  "imports": {
    "pako": "https://unpkg.com/[email protected]/dist/pako.esm.mjs",
    "tiled-load": "https://unpkg.com/tiled-load@latest/dist/tiled-load.modern.js"
  }
}
</script>

<script type="module">
import tiled from 'tiled-load'
</script>

You can also do it older-style, if you don't have module-support:

<script src="https://unpkg.com/tiled-load"></script>
<script src="https://unpkg.com/[email protected]/dist/pako.min.js"></script>
<script>
const map = await tiled('demo.tmj', './example/')
</script>

todo

I still have a few things I need to implement to feel like this lib is done.

• [ ] working demo in simple HTML (in example/) setup on github pages
• [ ] make tile lookups simpler (maybe include tileset and pixel offset in tiles, shape like tiles[x][y] = { ts: 0, x: 320, y: 256 } where X/Y are map-coordinates for a single tile)
• [ ] xml support (use optional import, like I do with pako/atob)
• [ ] rewrite kaboom lib to use this
• [ ] write node-raylib addon lib to use this
• [ ] CI releases