Tile Map experiment

#1

I thought I’d just pop this on here as I have a habit of loosing or forgetting about ideas over time. It’s a quick experiment to turn a single image of a game level (in this example DonkeyKong Country) into a usable tile map with support for tile flipping.

I created it in javascript as an html webpage so that it would be platform independent. Also it has the benefit of being forced-opensource so other people can have a poke about with it to make it better.

In there you will find maprecon.html which can load an image, and cut into a map of tiles.
There is also an example project to display this format. It’s using the TAS engine as a base, but with a custom line filler in place of the main background.

image

That 71fps is a little inaccurate as (for me) it runs slightly faster in the emulator. On hardware I get 61fps with the current code.

5 Likes
#2

Nice! Does it eliminate duplicate tiles?

#3

That’s exactly what it does. Starting at the top left, it converts the image one tile at a time, removing duplicates and mirrors. Resulting in image maps much smaller. For example a lot of the trees and rocks in DKC were mirrored and by adding that capability to my line filler, I was able to fit the HUGE 5376x512 image into the project and still take up less than 200kb.

15578
155785376×512 672 KB

8 Likes
#4

Here’s a short video, recording a gif doesn’t do it justice…

#5

The Pokitto forum accepts video uploads too:

2 Likes
#6

Yup. I would still prefer videos to be off-site

2 Likes
#7

I’ve been thinking… how much would it effect the update speed, if it were to update a couple of tile rows at a time, loading the required tiles into RAM from SD… ?

1 Like
#8

Entirely possible

#9

Wonder if you could effectively stream the tiles in a similar fashion to my pinball engine prototype. You’d need a custom lineFiller for it but the idea would be to only update tile rows that need to be redrawn (I used a bit array and had a routine to flag the area of a sprite for redraw). Then you could simply load the required tiles, render them, then load the next set and only need to have a tile buffer storing one row at a time.

Alternatively, I’m not sure what the tile size is but maybe try splitting them into 8x8 tiles then make a quick tool to iterate over each tile and compare it to all other tiles normal, and mirrored to see which ones are able to be duplicates. From there you could split the map into chunks and determine how many tiles (and which ones) to load for each chunk.

Really cool demo so far, can’t wait to see how well you’re able to make it work once you get some basic sprites moving around and gameplay logic.

#10

That’s exactly what this does to create the map. I believe my custom line filler is part of the reason I’m getting 61-62fps with this demo :sunglasses:

3 Likes
#11

Well, I just found a dkc map editor online and extracted the tiles from that, and I got 894 tile from the genuine game data and my map re-constructor got 857 tiles from a screengrab I found on a website. So I’m happy with that :stuck_out_tongue:

3 Likes
#12

62fps on hardware and wiggling!
animation-1

6 Likes