Skip to content

Algo Viz is a web-based visualizer for pathfinding, searching, and sorting algorithms, built using React.js. It helps users understand algorithm behavior through interactive, real-time animations and a clean, intuitive UI.

Notifications You must be signed in to change notification settings

threngthan/algo-viz

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

9 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Algo Viz 🌟

Algo Viz

Algo Viz is a web-based visualizer designed to illustrate pathfinding, searching, and sorting algorithms. Built using React.js, it provides users with an interactive experience to understand how these algorithms work through real-time animations and a clean, intuitive user interface.

Table of Contents

Features

  • Interactive UI: Users can interact with the visualizer to better understand algorithm behavior.
  • Real-time Animations: Watch algorithms in action as they process data.
  • Multiple Algorithms: Supports various pathfinding, searching, and sorting algorithms.
  • User-friendly Design: A clean interface makes navigation easy for everyone.
  • Web-based: No installation required; run it directly in your browser.

Getting Started

To get started with Algo Viz, download the latest release from the Releases section. After downloading, extract the files and open the index.html file in your web browser.

Prerequisites

  • A modern web browser (Chrome, Firefox, Safari, etc.)
  • Basic understanding of algorithms (optional but helpful)

Usage

Once you have the application open, you can choose from various algorithms. Each algorithm has a brief description, and you can initiate the visualization by clicking the corresponding button.

Steps to Use

  1. Select an Algorithm: Choose from pathfinding, searching, or sorting algorithms.
  2. Input Data: If required, input your data into the provided fields.
  3. Start Visualization: Click the "Visualize" button to see the algorithm in action.
  4. Pause/Resume: You can pause or resume the visualization at any time.
  5. Reset: Click the reset button to start over.

Supported Algorithms

Algo Viz currently supports the following algorithms:

Pathfinding Algorithms

  • A Search*: A popular algorithm for finding the shortest path.
  • Dijkstra's Algorithm: An efficient method for finding the shortest paths in a graph.
  • Breadth-First Search (BFS): Explores all neighbors at the present depth prior to moving on to nodes at the next depth level.
  • Depth-First Search (DFS): Explores as far as possible along each branch before backtracking.

Searching Algorithms

  • Linear Search: A simple search algorithm that checks every element.
  • Binary Search: Efficiently finds an item in a sorted array.

Sorting Algorithms

  • Bubble Sort: A simple sorting algorithm that repeatedly steps through the list.
  • Quick Sort: An efficient sorting algorithm that uses divide-and-conquer.
  • Merge Sort: A stable sorting algorithm that divides the array into halves.

Technologies Used

  • React.js: A JavaScript library for building user interfaces.
  • HTML/CSS: For structuring and styling the application.
  • JavaScript: For implementing the algorithms and interactivity.
  • D3.js: For creating dynamic, interactive data visualizations.

Contributing

We welcome contributions to Algo Viz! If you have suggestions or improvements, please fork the repository and submit a pull request. Here’s how to contribute:

  1. Fork the Repository: Click on the "Fork" button at the top right corner.
  2. Clone Your Fork: Use git clone <your-fork-url> to clone your fork to your local machine.
  3. Create a New Branch: Use git checkout -b feature-branch to create a new branch for your feature.
  4. Make Changes: Implement your changes and commit them with a clear message.
  5. Push Changes: Push your changes to your fork using git push origin feature-branch.
  6. Submit a Pull Request: Go to the original repository and click on "New Pull Request."

License

This project is licensed under the MIT License. Feel free to use, modify, and distribute it as you see fit.

Contact

For any inquiries or feedback, please reach out to the maintainer:

For the latest releases, visit the Releases section to download the latest version.

Acknowledgments

  • Thanks to the open-source community for their contributions and support.
  • Special thanks to the developers of the libraries used in this project.

Conclusion

Algo Viz aims to make learning algorithms engaging and accessible. By providing a visual representation, users can grasp complex concepts more easily. We hope you enjoy using Algo Viz and find it helpful in your learning journey.

For the latest updates and releases, check the Releases section.

About

Algo Viz is a web-based visualizer for pathfinding, searching, and sorting algorithms, built using React.js. It helps users understand algorithm behavior through interactive, real-time animations and a clean, intuitive UI.

Topics

Resources

Stars

Watchers

Forks

Packages

No packages published

Contributors 2

  •  
  •