• HTML5
• HTML Canvas
• CSS3
• Bootstrap
• Vanilla Javascript

Green Color The Start Node

Red Color The Finish/End Node

Purple Color The Wall Node/obstacle

Golden Color The Nodes that are currently being visited

Dark Green Color The Final Path

Here resides various algorithms that can be visualized.
Algorithms implemented currently

• Dijkstra
• Breadth-First-Search
• Depth-First-Search
• A* (Euclid heuristic)
• A* (Manhatan heuristic)
• Bidirectional Dijkstra

Certain Techniques to create Mazes.

• Simple
• Recursive division
• Recursive division (Horizontal - Vertical)

Basically clears the canvas so that we can create new Nodes and walls.

The + is used to increase the cell width which makes the canvas more bigger.

The - is used to decrease the cell width so that more cells can be accomodated.

• The position of startNode and finishNode can be changed by simply clicking on it.

• For given generated nodes clicking on any algorithm resets the visited nodes and path without changing the configuration of walls and starts running the algorithm.

• Dijkstra Algorithm : Dijkstra Algorithm
• A star Algorithm : A* Algorithm
• Bidirectional Dijkstra : Bidirectional Dijkstra
• Recursive Division : Maze-generation
• For learning HTML Canvas : Tutorial