OK so I talked about hexagonal coordinate system in my previous post but actually there are more than just one way to do it. The one I used in my previous post ( let’s call it standard ) is probably the most straight forward and simplest way to do it. It’s also pretty much my favorite because of that but still there is one other way I would like to talk about, radial hexagonal coordination structure.
I really don’t know if this system has an official name but I’ll refer to it as radial structure from now on. Unlike the system we used before ( which uses a standard coordinate system with 2 axis) , radial coordinate system uses 3 axis for 2 dimensional mapping.
Sounds weird right? OK this picture will probably help a lot ;
So let’s talk about this radial coordinate structure a bit ;
As you can see , this system uses 3 axis ( I’ll refer to those axis as r ( red ) , g ( green ) and b ( blue )) and the origin is in the middle instead of a corner ( the structure we used previously used top right as (0,0)).
You may also have noticed that in this system, we have rings around our starting hex. First ring has 6 hexes and the sum of absolute r,g,b values of those hexes is equals to 2
Second ring has 16 hexes and sum of absolute r,b,b values of those hexes is equals to 4
I guess you can see the pattern there.
Oh also for every hex, sum of r,g,b values is equals to zero. So in a way, r,g,b values shows how many step you need to take in various directions to reach (0,0,0).
Now check this out to see how each axis behave;
As you can see red increases as we move from northwest to south east , green increases as we move from northeast to south west and blue increases as we move from south to north. You can also check out the axis arrows in that first picture.
Now if we put all those 3 on top of each other, we’ll have a 3 axis structure.
OK but how does this help? This structure is actually just a standard square grid with a matrix transformation , so the calculations are easier and somewhat more elegant. Instead of checking every sections like we did in previous post, we’ll just use some magical equations to find hex coordinates.
I guess it sounds confusing and actually I’m making it way more confusing than it should be , so I’ll just move on to the code part.
Again we’ll need 2 main functions ;
1) Hex coordinate to pixel coordinate
2) Pixel coordinate to hex coordinate
And luckily some nice fellow at this Stackoverflow question worked out all the equations so all we need to do is implement them properly.
x = sqrt(3) * s * ( b/2 + r)
y = 3/2 * s * b
r = (sqrt(3)/3 * x – y/3 ) / s
g = -(sqrt(3)/3 * x + y/3 ) / s
b = 2/3 * y / s
r,g,b are the hex coordinate axis
x,y are pixel coordinate axis
s is the edge length of a hexagon
Hex Coordinate to Pixel Coordinate
(float) (1.73 * Radius * (position.Z/2+ position.X)),
(float) 3/2 * Radius * position.Z
Position is r, g, b coordinate so it’s Vector3. ( x = r , y = g, z = b )
Not much to say here really, I didn’t even bother to calculate equations myself and it’s extremely easy when you got the equations right? 2nd function isn’t hard either ;
Pixel Coordinate to Hex Coordinate
(float)Math.Round((1.73f/3.0f* position.X – position.Z /3) / Radius),
(float)Math.Round(–(1.73f/3.0f* position.X + position.Z /3) / Radius),
(float)Math.Round(0.66* (position.Z /Radius)));
Position here is the Vector2 which we want to get Hex coordinates for. And the Vector3 we create is the r, g, b coordinates. Again not much to explain here, you just provide the coordinates and equations spit out the result, magic I say, magic !
So which one is better?
Well I can’t really say I have vast experience in hexagon calculations but at this moment , I can’t see a breaking difference between two so it’s just personal preferences for me.
Obviously this radial structure calculations are easier and will probably be faster but the difference is so small that I highly doubt you’ll feel anything unless you’re making thousands of calculations every second.
On the other hand, standard / rectangular structure coordinates are way easier to understand and use. Consider this for example ;
I’m pretty sure anyone can create this map in standard / rectangular coordinate system in a few minutes but it’ll be much harder in radial coordinate system that you’ll probably need a map editor. I love how I can predict the result and coordinates in standard system to be honest.
Anyway guess we’re pretty much done right? Am I missing something? It’s early in the morning ( and I have to leave soon ) so I suspect there’ll be lots of grammar mistakes and stuff. I hope it’s still somewhat understandable…
Oh well, I’ll be more careful next time!