A tiling technique demo

Showcase your libraries, tools and other projects that help your fellow love users.
Post Reply
GarbagePillow
Prole
Posts: 41
Joined: Wed Sep 26, 2012 9:19 pm

A tiling technique demo

Post by GarbagePillow »

Hey fellow Love2Ders, :)
wd6Mz.png
wd6Mz.png (9.86 KiB) Viewed 588 times
Let's say you have a game with tiles, but the tiles are generated dynamically by players (like in Minecraft or Terraria). Any tile can be next to any other. Creating tilesets that have baked in transition tiles would be a combinatorial explosion. One solution is to interpolate between tiles. Another is to make the tiles slightly overlap and draw them on top of each other. Here is an example of that. By texturing on corners of tiles, you can actually create all the tile transitions using only 14 tiles. One problem with this technique is the texture repeats itself over and over.

An alternative for Wang tiles: Colored edges versus colored corners has a great solution to this problem. You can get transitions and texture variation using three colors, one for transitions and two for variation. This requires 80 texture tiles for each tile type (dirt, sand, water, cobblestone). That's a lot of texture painting if you do it manually, but it is doable.

So, I've made a demo of this technique. Try it out and let me know what you think.
Attachments
CornerTiles.love
(16.95 KiB) Downloaded 318 times
mode7
Prole
Posts: 35
Joined: Tue Aug 21, 2012 5:45 pm
Contact:

Re: A tiling technique demo

Post by mode7 »

Interesting post and articles. I'm working on the same problem currently.
Here's another, more game-oriented article on the subject.
http://www.codeproject.com/Articles/106 ... n-a-Tile-M

Why do you have to use 81 combinations? Why not using alpha channels and terrain precedence, so you always have to deal with only two terrain types at once thus 16 * n instead of n^4 tiles.

Another approach would be the RPGmaker one, which splits tiles in four subtiles, to create every combination possible from a simple 12 tiles set.
User avatar
ivan
Party member
Posts: 1915
Joined: Fri Mar 07, 2008 1:39 pm
Contact:

Re: A tiling technique demo

Post by ivan »

Hi. Pretty cool example you have there.
BTW, there is a nice approach for doing 'auto-tiling' which involves a little bit of bitwise math:
http://web.archive.org/web/201107152342 ... com/?p=184
It works pretty well and you only need 16 tiles in total (2 tile types to the power of 4 edges).
If you want to have more than 2 tile types you'll need a lot more transitions: 3^4=81, 4^4=256, 5^4=625, etc but notice that the number grows quite rapidly after 3^4.
One solution is to overlay the different tile types as explained in the link you already provided:
http://www.gamedev.net/page/resources/_ ... errai-r934
User avatar
Kadoba
Party member
Posts: 399
Joined: Mon Jan 10, 2011 8:25 am
Location: Oklahoma

Re: A tiling technique demo

Post by Kadoba »

80 combinations per tile is a bit unrealistic if you plan to do it by hand. Although it's always cool to see a new approach to an old problem.
mode7 wrote: Another approach would be the RPGmaker one, which splits tiles in four subtiles, to create every combination possible from a simple 12 tiles set.
If you're interested in the RPGmaker method I created a tutorial for it a while back. There might be an easier way but it works.
GarbagePillow
Prole
Posts: 41
Joined: Wed Sep 26, 2012 9:19 pm

Re: A tiling technique demo

Post by GarbagePillow »

mode7 wrote:Interesting post and articles. I'm working on the same problem currently.
Here's another, more game-oriented article on the subject.
http://www.codeproject.com/Articles/106 ... n-a-Tile-M
Good article. One difference between techniques is here:
Variety
Despite the use of smoothly transitioning tiles, an observer can still be alienated by repeated patterns of the same tiles as can be seen in Figure 1. The algorithm can be improved by mapping each 4-bit index to more than one tile variant and have the algorithm select variants at random for the newly placed tile and for its neighbours.
This would require the tile variants to be seamless with each other on all texture edges. The technique I am using allows for more variety in the edges and corners.
mode7 wrote:Why do you have to use 81 combinations? Why not using alpha channels and terrain precedence, so you always have to deal with only two terrain types at once thus 16 * n instead of n^4 tiles.
There are other ways to do it for sure. One thing to note about this technique is that there is no repeated texture over any of the tiles (except two small cobblestones exactly on the two non transparent colors, but that can be fixed a bit) that means none of the texture is actually wasted, all tiles are adding good variety.
ivan wrote:Hi. Pretty cool example you have there.
BTW, there is a nice approach for doing 'auto-tiling' which involves a little bit of bitwise math:
http://web.archive.org/web/201107152342 ... com/?p=184
It works pretty well and you only need 16 tiles in total (2 tile types to the power of 4 edges).
If you want to have more than 2 tile types you'll need a lot more transitions: 3^4=81, 4^4=256, 5^4=625, etc but notice that the number grows quite rapidly after 3^4.
One solution is to overlay the different tile types as explained in the link you already provided:
http://www.gamedev.net/page/resources/_ ... errai-r934
I really like the bitwise math way of just ORing the corners together. I kind of wish love2d included a bit library. I've been using https://github.com/davidm/lua-bit-numberlua for some stuff, but it is kind of slow.
Kadoba wrote:80 combinations per tile is a bit unrealistic if you plan to do it by hand. Although it's always cool to see a new approach to an old problem.

If you're interested in the RPGmaker method I created a tutorial for it a while back. There might be an easier way but it works.
Yeah, it's tedious as hell. I do like the end result though. Thanks for the RPGmaker tutorial, I was just about to go looking for information on that.
User avatar
ivan
Party member
Posts: 1915
Joined: Fri Mar 07, 2008 1:39 pm
Contact:

Re: A tiling technique demo

Post by ivan »

Kadoba wrote:80 combinations per tile is a bit unrealistic if you plan to do it by hand. Although it's always cool to see a new approach to an old problem
BTW, the terrain in Civilization 3 uses tilesheets containing 81 tiles each.
They have 3 transitions per tilesheet for example water/desert/grassland or water/grassland/plains, etc.
The end result looks pretty good and they only have about 8-10 tilesheets in total.
Basically, Civ 3 disallows certain transitions like desert/icesheet or tundra/desert, etc which is another way of lowering the total number of transition tiles.
That's still a lot of tiles to draw by hand but in Civ 3 they obviously used a 3D program to pre-render the tiles.
Post Reply

Who is online

Users browsing this forum: No registered users and 2 guests