Sorting Visualizer

A dynamic and interactive web-based sorting visualizer that helps users understand various sorting algorithms. Users can generate random arrays, input their own arrays, adjust visualization speed, and observe the time and space complexity of each algorithm in action. The visualizer uses color-coded steps to enhance understanding:

• Blue: Default state
• Yellow: Being compared
• Red: Incorrect position, to be moved
• Green: Correct position

Live Demo

Try the Sorting Visualizer live at: Sorting Visualizer

Features

• Visualize popular sorting algorithms:

  • Bubble Sort
  • Selection Sort
  • Insertion Sort
  • Merge Sort
  • Quick Sort
  • Heap Sort
  • Counting Sort
  • Tim Sort

• Generate random arrays of different sizes.

• Input custom arrays for personalized testing.

• Adjust the speed of the visualization for better clarity.

• Displays Time Complexity (Best, Average, Worst) and Space Complexity.

• Refresh functionality to restart or reset the visualization.

Technologies Used

• HTML: Structure of the web app.
• CSS: Styling and layout.
• JavaScript: Core functionality, algorithms, and visualizations.

Demo

Installation

1. Clone the repository:

   git clone https://github.com/kmusadiqpasha/sorting-visualizer.git

2. cd sorting-visualizer
3. Open index.html in your web browser to launch the application.

Usage

1. Adjust the Size of the Array using the slider.
2. Set the Speed of visualization using the speed slider.
3. Click Generate Random Array to create a new array or input your own array (comma seperated) and click Generate from Input.
4. Choose a sorting algorithm by clicking its respective button.
5. Observe the real-time visualization and complexity metrics displayed on the screen.

Future Enhancements

Here are some potential features and improvements planned for the Sorting Visualizer:

1. Additional Sorting Algorithms:

   • Add more algorithms like Radix Sort, Shell Sort, and Bucket Sort for a broader comparison.

2. Algorithm Comparison Mode:

   • Provide a side-by-side visualization to compare multiple algorithms simultaneously.

3. Performance Metrics Dashboard:

   • Include a detailed dashboard to show real-time performance metrics such as execution time, swaps, and comparisons.

License

• This project is licensed under the MIT License - see the LICENSE file for details.

Just follow me and Star ⭐ my repository

Thank You!!