Search website

Article : Hex Coordinate Systems

In the course of this article, we will write a class for the handling of Hex coordinates.

Hexagon Dimensions

First, we will calculate the dimensions of various parts of a hexagon. To calculate the width and halfWidth, we use the pythagorean theroem.

Coordinate System

Origin and Center

We will use Vector2s as our hex tile map coordinates. Tile map coordinates increase to the right and up.

We will need to turn tile map coordinates into world coordinates. There are two points that make logical tile origins. There is the center of the tile, and there is the point outside the hex, as in the diagram.

Whichever you use, the value is the same. All you’re changing is which of these you position at 0,0. Be consistent in your drawing code, and these two values will be the same. This does make a different later, in the conversion from world coordinates back to tile coordinates. The origin point is the easier to work with there, so that’s what we’ll use here.

We must account for every other row being offset half a hex width.

Notice that we use the rowHeight value, not the height value. This accounts for the way Hexagons interlock.

We’ll go ahead and calculate the center based on the origin.

Directions

The chief advantage of a hex map over a square map is that there are six neighbors all the same distance away, rather than only four. We will first create an enumeration to represent our six directions, then we will define some functions for manipulating them.

Now we will add a few functions to manipulate directions.

Finding the opposite is probably the simplest.

Now that we have directions, we can figure out who our neighbors are. We must again account for odd numbered rows being different. The algorithm is pretty simple. We must simply apply a different set of offsets per direction depending on whether this is an odd or even row.

Even Neighbors

Odd Neighbors

Unfortunately, as you can see, iterating over tiles in a specific direction is not as simple as incrementing values in the tile coordinate. To iterate in a specific direction, use a loop such as

There’s not much left. All we need to do now is get a tile coordinate back from a world coordinate. This requires a little bit of linear algebra, and once again we are complicated by odd rows.

First we will calculate a few constants to make the rest of code simpler.

World to Tile

The first step is to find our position in a square grid. This grid allows us to divide the hex map into two types of tiles.

Now we find the offset of the real point from the corner of this square grid section.

Looking at the diagram for section A, we can see that two hexagons poke into the bottom of the square. We plug the offset’s X value into the equation for the line of the top of those hexes at the bottom. If you’ve taken algebra, you know that the equation of a line like this is Y=MX+B. That’s why we calculated the rise and slope earlier. The line on the left of section A has a negative slope, and a Y intercept of rise. The other has a positive slope, and a Y intercept of negative rise. We adjust the X,Y tile coordinates if we discover that the point is below one of these lines. This is the same adjustment used for finding neighbors.

Section B is slightly more complex. First we determine if the point is in the right or left section. Since odd rows are offset by halfWidth, the large section on the right has the same coordinates as the square grid.

Here’s a complete class, ready to handle Hex coordinate systems.

Download the Hex Coordinate sample.

Additionally, this is implemented in my Jemgine.Hex library, available on Codeplex. (Click)

1 response on Article : Hex Coordinate Systems

  1. Hi, I was working on a hex based game in unity and I appreciate you sharing your hex class. I’m using north/south oriented tiles but with a little modification I think this will work swimmingly =]

    Thanks again!

Leave a Reply

Switch to our mobile site