A simple A* pathfinding visualizer built with TypeScript and HTML Canvas.
Maps are loaded from the ./data/ folder.
Change the MAP variable to select which map to use:
const MAP = 'map0001';The value should match the map JSON filename without the .json extension.
Example:
./data/map0001.json
-
Left click on node
- Set the start node
- Restart pathfinding
-
Right click on node
- Set the end node
- Restart pathfinding
-
Middle mouse button + drag
- Pan the map
-
Mouse wheel
- Zoom in and out
- Red node - Start node
- Green node - End node
- Blue nodes - Open set (nodes waiting to be checked)
- Purple nodes - Closed set (nodes already checked)
- Yellow line - Final path