This project is an interactive web-based platform for visualizing various algorithms, with a focus on pathfinding algorithms. Built using Elixir and Phoenix LiveView, it allows users to interact with and observe the behavior of different algorithms in real-time.
- Interactive grid where users can add/remove walls by clicking
- Draggable start and end points
- Real-time visualization of the A* algorithm's search process
- Responsive full-screen design
- Clear and restart functionality
Before you begin, ensure you have the following installed:
- Elixir (version 1.14 or later)
- Phoenix Framework (version 1.7 or later)
- Node.js (version 14 or later)
-
Clone the repository:
git clone https://github.com/yourusername/astar_visualizer.git cd astar_visualizer -
Install dependencies:
mix deps.get cd assets && npm install && cd .. -
Create and migrate the database:
mix ecto.create && mix ecto.migrate
To start the Phoenix server:
-
Start the server:
mix phx.server -
Visit
localhost:4000in your browser.
- Adding/Removing Walls: Click on cells to toggle walls on and off.
- Setting Start/End Points: Drag the 'S' (Start) and 'G' (Goal) markers to desired positions.
- Start Pathfinding: Click the "Start Pathfinding" button to visualize the A* algorithm.
- Clear Grid: Use the "Clear Grid" button to reset the visualization.
The application uses Phoenix LiveView to create a real-time, interactive grid. The A* algorithm is implemented in Elixir and visualized step-by-step on the grid. The algorithm finds the shortest path between the start and goal points while avoiding walls.
Contributions are welcome! Please feel free to submit a Pull Request.
This project is licensed under the MIT License - see the LICENSE.md file for details.
- Phoenix Framework and the Elixir community
- All contributors who have helped with the project
If you encounter any problems or have any questions, please open an issue in the GitHub repository.