As I have been building on a RTS game based on hexagon grid built in javascript i stumbled across a problem regarding the coordinate system. Have been trying to implement a A-star system to find paths. But it seems a horizontal hex gird could cause some problems so far when it comes to odd and even.

It was made horizontal as it is the way it is rendered to make all graphics not overlapping improper.

So now to my question after some digging on the web. How do you convert between horizontal and 60 degrees coords?

Have tried this code, but its not good enough, and stuck at what Im missing for my two functions GetWorldXpos and GetWorldYpos.

 function DrawHex(context, hexagonData, isEven, x, y) { var heightValue; heightValue = GetIntNoDecimals(hexagonData.heightValue); //parseInt(hexagonData.heightValue, 10); //sets up so if the height of sea-levels is achived it should be equal level heightValue = CheckForLakeLevel(heightValue); //Gets color code depengin on height var colorCode = GetColorCode(heightValue, hexagonData.heightValue); if(isEven){ //creates and draws object var hex = new HexagonObj(GetLargeMapXpos(x), GetLargeMapYpos(y), GetWorldXpos(x + 1, y), GetWorldYpos(x, y)); hex.Draw(context, 0.99, lmapData.spaceing, colorCode, (heightValue), 0); //Adds data for usage how to draw other worl dependent objects lmapHeightData.push(new LargeGridData(GetLargeMapXpos(x), GetLargeMapYpos(y), GetWorldXpos(x, y), GetWorldYpos(x, y), heightValue)); } else { //creates and draws object var hex = new HexagonObj(GetLargeMapXpos(x), GetLargeMapYpos(y) + lmapData.spaceing, GetWorldXpos(x, y), GetWorldYpos(x, y)); hex.Draw(context, 0.99, lmapData.spaceing, colorCode, (heightValue), 0); lmapHeightData.push(new LargeGridData(GetLargeMapXpos(x), GetLargeMapYpos(y) + lmapData.spaceing, GetWorldXpos(x, y), GetWorldYpos(x, y), heightValue)); } } //Gets what is the coordinate to be drawn on screen function GetLargeMapXpos(x) { var lgX = ((lmapData.posX + lmapData.spaceing) * x) + lmapData.areaPosX + lmapData.correctionX; return lgX; } //Gets what is the coordinate to be drawn on screen function GetLargeMapYpos(y) { return (lmapData.posY * y) + lmapData.areaPosY + lmapData.correctionY; } //Gets what is the coordinate for current hexagon function GetWorldXpos(x, y) { return (x + lmapData.cameraPosX) - ((y + lmapData.cameraPosY) * 2); } //Gets what is the coordinate for current hexagon function GetWorldYpos(x, y) { return y + lmapData.cameraPosY + (x + lmapData.cameraPosX); } 

Any suggestions?