Pathfinding Algorithm Visualizer
A web-based visualizer for pathfinding algorithms with an editable grid and weighted terrain tiles.
This is a 4th place winner in a 24hr college hackathon. The project is a web-based visualizer for pathfinding algorithms. It features an editable grid where users can place walls and weighted terrain tiles, and visualize the pathfinding process of various algorithms in real-time. The visualizer supports multiple algorithms including A*, Dijkstra, BFS, and DFS, and provides information on algorithm run time.
My Process:
Given the time constraint, I utilized boiler plate code for the algorithms since these are solved problems. I had to make changes to them to support animation, especially with A* and Dijkstra since they are greedy algorithms. I created a custom Node data structure for the grid to allow terrain and neighbor data to be stored. I created a simple grid-based level editor which allows for placing a start and end point and 3 types of terrain tiles. I built the project with Vite due to its speed and simplicity, and the lack of need for a more complex framework. I utilized React for the UI and state management and availability of boilerplate code so that I could focus more on the function than the frontend.
Screenshots