Hexagonal grid debugger

 from Red Blob Games
01 Dec 2018

x {{mouseover.x.toFixed(0)}}
y {{mouseover.y.toFixed(0)}}
q {{mouseoverHex.q}} {{mouseoverFractionalHex.q.toFixed(3)}}
r {{mouseoverHex.r}} {{mouseoverFractionalHex.r.toFixed(3)}}
s {{mouseoverHex.s}} {{mouseoverFractionalHex.s.toFixed(3)}}
width = {{width.toFixed(3)}} horiz = {{horiz.toFixed(3)}}
height = {{height.toFixed(3)}} vert = {{vert.toFixed(3)}}

orientation =

{{maxDistance}}

This is a debugging tool I use sometimes. The dashed line represents the pixel axes x=0, y=0. Move the mouse around and look at the hex coordinates at the bottom.

Email me , or comment here: