Sorting Visualizer

A web-based application to visualize various sorting algorithms. This interactive tool allows users to input or generate arrays and observe how different sorting algorithms work in real-time. The visualizer supports multiple sorting algorithms, highlights comparisons, and marks sorted elements, providing an educational and engaging way to understand sorting algorithms.

Features

• Interactive Interface: Input custom arrays or generate random arrays.
• Multiple Sorting Algorithms: Visualize Bubble Sort, Insertion Sort, Selection Sort, Heap Sort, Counting Sort, Merge Sort, Quick Sort, Radix Sort, and Bucket Sort.
• Real-time Visualization: Watch the sorting process with animations, highlighting comparisons and swaps.
• Control Buttons: Start, pause, and reset the sorting process.
• Statistics: Track the total number of comparisons and swaps made during sorting.

Technologies Used

• HTML: Structure of the web page.
• CSS: Styling for the visual elements.
• JavaScript: Functionality and sorting algorithms implementation.

How to Use

1. Clone the repository:

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

2. Navigate to the project directory:

   cd sorting-visualizer

3. Open

index.html

in a web browser:

start index.html

4. Use the navigation buttons to select a sorting algorithm.
5. Input an array or generate a random array.
6. Click "Start" to begin the visualization.
7. Use "Pause" to pause/resume and "Reset" to clear the array and statistics.

Project Structure

• index.html: The main HTML file that sets up the structure of the web page.
• style.css: The CSS file that provides styling for the visual elements.
• app.js: The JavaScript file that implements the functionality and sorting algorithms.

Sorting Algorithms Implemented

• Bubble Sort: Repeatedly swaps adjacent elements if they are in the wrong order.
• Insertion Sort: Builds the sorted array one item at a time.
• Selection Sort: Selects the smallest element from an unsorted list in each iteration.
• Heap Sort: Converts the array into a heap and then sorts it.
• Counting Sort: Counts the number of objects having distinct key values.
• Merge Sort: Divides the array into halves and merges them in a sorted manner.
• Quick Sort: Divides the array into smaller arrays based on a pivot.
• Radix Sort: Sorts numbers by processing individual digits.
• Bucket Sort: Distributes elements into buckets and sorts them.