Hi,

I have always wanted to write a simple version of the Settlers of Catan game and I keep finding myself coming back to it after giving up...

This time I thought I'd start with a solid basis, and I think this would be an interesting problem to post here...

As most of you probably know, the Settlers of Catan game has a hexagonal grid of tiles:
http://www.mrbass.org/games/sea3d/01startinggame.jpg

I have tried implementing hexagonal tiles in WPF (though I think I'm staying with Winforms this time, not important though) where I simply drew the tiles as rows, where each odd tile in the row was offset by half the tile height. That works quite well for drawing the game board in itself, but as I found out, it is a giant pain to draw the game pieces on this board, because finding their positions (where to draw them) is quite difficult... If you are not familiar with the game, read on, you will understand why quickly.



So, I want to come up with a solid basis that allows me to easily find the X and Y coordinates of the position where I want to draw a game piece, based on (1) a tile coordinate and (2) a special position on that tile.


For numbering the tiles, I have done a quick search on hexagonal coordinate systems, and this seems to be the easiest numbering system. Basically a skewed x,y system, such as this:

The blue tiles are the boundaries of the playing board (they depict water). White tiles in between the blue boundaries are playing tiles, white tiles outside of the blue boundaries aren't really part of the board, but doesn't really matter.

As you can see each tile has a unique coordinate (x,y).

The problem is that the game needs to draw pieces on various positions along any of these tiles. I've depicted this here:


The red dots are the (center) positions where I need to draw game pieces, the red rectangles depict rectangles that I will have to draw.


My problem now is two-fold

(1) How would I number these positions in a clever way?
For example, suppose I want to reference the bottom-right corner of the hexagon at position (-1,2). I could give each corner a number (0-5), such that the bottom-right corner would for example be 5 (see image). Then the corner I need is at position (-1,2,5), meaning tile (-1,2) and corner 5.

Of course, these corners share tiles. Corner 5 (bottom-right) of tile (-1,2) is the same point as corner 1 of tile (-1,1) and corner 3 of tile (0,1).
(-1,2,5) = (-1,1,1) = (0,1,3).

There must be some kind of mathematical relation between these corners, yet I can't find it. This system seems really redundant and inefficient.


(2) How do I transform these hexagonal coordinates into traditional (x,y) orthogonal coordinate system used by winforms, so I can draw images there?

For example, suppose I want to draw an image on the bottom-left corner of tile (0,-1), that would be hexagonal position (0,-1,4). How does (0,-1,4) transform to (x,y) in orthogonal coordinates? I'll need some kind of transformation to transform (a,b,c) in hexagonal coordinates to (x,y) in orthogonal coordinates.

Of course, I could derive this transformation with the system I currently devised, but I doubt my system is very efficient, there must be a better way?



I thought this was an interesting problem to post here. I will continue working on this, but if anyone has anything to say about it, please! As I said, my system is probably not very good, if anyone knows a better system that would be great....

Thanks!