The Algorithm Visualizer allows users to visually explore algorithms like Integer Multiplication and the Closest Pair of Points problem. It dynamically displays each step of the algorithm to help users understand the underlying logic and process.

1. Integer Multiplication

   • Visualize the process of multiplying large integers using various algorithms.
   • Expected input format:
     Each file should contain two integers separated by a space in one line.
     Example:

     123456 789012 

   • This input will be processed and visualized step by step in the multiplication process.

2. Closest Pair of Points

   • Visualize the algorithm for finding the closest pair of points in a 2D plane using a divide and conquer approach.
   • Expected input format:
     Each line of file should contain two space-separated values representing the x and y coordinates of a point.
     Example:

     1 2 3 4 5 6 7 8 

   • These points will be used to find the closest pair of points and the steps involved in the algorithm will be visualized.

• Interactive visualizations of the closest pair of points and integer multiplication algorithms.
• Step-by-step animation showing how the algorithm works in real time.
• Adjustable zoom and pan for better visual analysis.
• Ability to upload custom input files or generate random input files using a Python script.

algorithm-visualizer/ ├── generateTestFiles.py # Python script to generate random test input files ├── generated_test_files/ # Folder containing generated test input files │ └── sample_test_case.txt # Example generated input file (can vary by algorithm) ├── algorithm-visualizer/ # React Vite app folder (frontend) │ ├── public/ # Public static files (index.html, favicon, etc.) │ ├── src/ # React source code │ │ ├── assets/ # Folder for images, icons, GIFs │ │ ├── components/ # React components like VisualizerComponent | | |── pages/ # React pages │ │ ├── main.jsx # Entry point for React app (Vite's main entry) │ │ └── ... # Other React-specific files │ ├── package.json # Project dependencies and scripts │ ├── package-lock.json # Exact versions of dependencies (auto-generated) │ ├── vite.config.js # Vite configuration file │ └── README.md # ReadMe file with project instructions (this file) ├── .gitignore # Git ignore file to exclude node_modules, etc. ├── LICENSE # License file (if applicable) └── README.md # Project's ReadMe file with overview, instructions, etc. 

To set up and run the project locally, follow these steps:

Clone the repository to your local machine using Git:

git clone https://github.com/sunnyallana/algorithm-visualizer.git cd algorithm-visualizer

Navigate to the algorithm-visualizer folder and install the required npm packages:

cd algorithm-visualizer npm install

The project includes a Python script generateTestFiles.py located in the root directory. This script generates random test files that can be used as input for the visualizer.

1. Ensure you have Python 3 installed on your machine.
2. Run the following command in your terminal from the root directory of the project:

python3 generateTestFiles.py

This will generate a folder called generated_test_files/ containing random input files.

To start the frontend React application locally

npm run dev

This will start the Vite development server. You can access the app at: http://localhost:3000