Welcome to the vibrant world of graphs and algorithms with the **Algo-Visualiser**! This interactive visualization tool equips you with the ability to understand different graph traversal algorithms by visualizing their workings in real-time. Ready to embark on this coding adventure? Let’s get started!

The Algo-Visualiser

An interactive visualiser which demonstrates the pros and cons of various graph solving algorithms.

About The Project

The Algo-Visualiser is a web app built in ReactJS designed to illuminate the inner workings of various graph traversal algorithms. Created by Bassel Al-Sayed and Tom Walker, this project emerged from a shared passion for ReactJS and understanding GPS systems through algorithmic approaches.

Features

• Select a maze size that adjusts to your device.
• Define start and end points for the maze.
• Add obstacles (fences) to challenge the algorithms.
• Choose from one of five available algorithms.
• Visual representation of the nodes being searched.
• Visualize the shortest path found by the selected algorithm.
• Reset the grid while retaining obstacles and points to compare different algorithms.
• View benchmarking statistics to assess performance across algorithms.

Getting Started

Follow these simple steps to get your Algo-Visualiser running:

1. Clone the repository:

   git clone https://github.com/Walker-TW/Algorithm-Visualizer.git

2. Change into the cloned directory:

   cd Algorithm-Visualizer

3. Install the necessary dependencies:

   yarn

4. Boot the server:
   • For hot reload development:

     yarn start

     Navigate to http://localhost:3000 in your browser.

   • To view the optimized build:

     yarn build

     serve -s build

     (Install ℹ️ by running yarn global add serve or npm i -g serve).

How To Use

This tool is designed for ease of use. Simply interact with the user interface to set your maze characteristics, choose an algorithm, and watch the magic unfold as paths are visualized. It’s like playing a board game, where each piece represents a node, and every move is an exploration of possible paths!

The Algorithms

The Algo-Visualiser showcases various graph traversal algorithms, each with unique ways of searching through the maze:

• Dijkstra: Think of a delivery service always looking for the fastest route, accounting for distance (weights) at each turn.
• A*: An efficient navigator that considers not just distance but also possible routes to reach the destination faster, like a smart GPS.
• Depth First Search: This is like exploring one branch in a family tree completely before moving to another; it may not always find the shortest route.
• Breadth First Search: Imagine having a crowd-search team where everyone checks neighboring paths before moving further ahead.

Contact The Team

Tom Walker

Bassel Al-Sayed

License

This project is distributed under the MIT License. For more details, refer to the LICENSE file in the repository.

Troubleshooting

If you encounter any issues while running the Algo-Visualiser, consider the following troubleshooting ideas:

• Ensure you have the correct version of Node.js and Yarn installed.
• Check for any missing dependencies in the project by looking at the package.json file.
• Try clearing the cache using yarn cache clean.
• If your server isn’t starting, review any error messages appearing in the terminal for clues.

For more insights, updates, or to collaborate on AI development projects, stay connected with fxis.ai.

At fxis.ai, we believe that such advancements are crucial for the future of AI, as they enable more comprehensive and effective solutions. Our team is continually exploring new methodologies to push the envelope in artificial intelligence, ensuring that our clients benefit from the latest technological innovations.