Isometric map
I've built this simple app to understand how to create isometric maps. It uses simple divs instead of a canvas element.
Feel free to modify it.
Files
- mapEngine.js: this contains the methods to draw the map to the screen.
- astar.js: the A* pathfinder algorithm.
- gameEngine.js: handling the mouse event, moving the guy on the screen, adding new tiles to the map, etc.
- selector.js: like a mini jQuery to do some basic DOM manipulation.
- overlay.js: the white overlay box. You see it on the top-left.
The Math behind isometric projection
The only page you need to read. It explains the topic very well and it is easy to follow. http://clintbellanger.net/articles/isometric_math/