My grid
tileWidth = 64px
tileHeight = 128px
(the image itself is 128px, though the actual diamond is 32px tall and 64px wide)
As you can see, I have a staggered grid system; however, I have spent the last two hours trying to think of a system where I can take the mouse coordinates relative to the canvas and figure out what tile was clicked (obviously within a diamond-shaped field).
For example, if I clicked tile 21, 26
-- how would I figure that out in the program?
Any pointers to get working in the right direction would be greatly appreciated. Thanks!
If you know the center position of the cell, which of course you do since they are rendered, you simply normalize the coordinate against the cell to find out if it is inside:
Here is a full demo: