Fibonacci Spiral Visualization

This project visualizes the Fibonacci Spiral using HTML5 Canvas and JavaScript. The spiral is dynamically generated based on user inputs for the scale, number of turns, and line thickness. Additionally, users can save the generated spiral as a PNG image.

Features

• Dynamic Fibonacci Spiral: Generate a Fibonacci spiral with adjustable parameters (scale, turns, thickness).
• Math Visualization: Displays mathematical properties (radius, angle) on the canvas for each segment of the spiral.
• Random Color Mode: The spiral initially renders in a random color, which can be overridden by the user using a color picker.
• Save as PNG: Users can save the generated spiral as a PNG image by clicking the "Save as PNG" button.

Technologies

• HTML5: Used for creating the structure and layout.
• CSS3: Provides styling for the layout, panels, and controls.
• JavaScript: Handles the canvas drawing, user inputs, random color generation, and saving functionality.

Getting Started

Prerequisites

Make sure you have a modern web browser (Chrome, Firefox, Edge, etc.) that supports HTML5 and JavaScript.

Installation

1. Clone the repository or download the project files:

   git clone https://github.com/your-username/fibonacci-spiral-visualization.git

2. Navigate to the project directory:

   cd fibonacci-spiral-visualization

3. Open the index.html file in your web browser to run the application:

   • On Windows: Double-click the index.html file.
   • On macOS/Linux: Right-click and open the file with your browser.

Usage

• Adjust the Spiral: Use the controls on the right panel to adjust the scale, number of turns, and line thickness of the Fibonacci spiral.
• Change the Color: Pick a color using the color picker to override the random color.
• Save the Spiral: Click the "Save as PNG" button to download the current visualization as a PNG image.

Controls:

• Scale: Determines the size of the initial segment.
• Number of Turns: Defines how many segments the spiral should have.
• Line Thickness: Adjusts the thickness of the lines in the spiral.
• Color Picker: Allows users to select a color for the spiral.
• Save as PNG: Downloads the current canvas as an image.

Example

Here's a screenshot of the Fibonacci spiral visualization:

License

This project is licensed under the MIT License. You can read the full license here.

Contributing

1. Fork the repository.
2. Create a new branch (git checkout -b feature/your-feature).
3. Commit your changes (git commit -m 'Add your feature').
4. Push to the branch (git push origin feature/your-feature).
5. Open a pull request.

Acknowledgments

• The Fibonacci sequence and golden ratio for inspiring this project.