https://github.com/qc20/electromagneticfield

ElectromagneticField: An interactive HTML5 Canvas visualization simulating electromagnetic interactions. Explore dynamic field lines and attractors in this mesmerizing, educational experience.
https://github.com/qc20/electromagneticfield

Last synced: 6 days ago
JSON representation

ElectromagneticField: An interactive HTML5 Canvas visualization simulating electromagnetic interactions. Explore dynamic field lines and attractors in this mesmerizing, educational experience.

• Host: GitHub
• URL: https://github.com/qc20/electromagneticfield
• Owner: QC20
• License: mit
• Created: 2024-07-22T22:13:47.000Z (4 months ago)
• Default Branch: main
• Last Pushed: 2024-07-22T22:44:17.000Z (4 months ago)
• Last Synced: 2024-07-23T02:14:34.243Z (4 months ago)
• Language: JavaScript
• Homepage: https://qc20.github.io/ElectromagneticField/
• Size: 458 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# ElectromagneticField

A mesmerizing interactive visualization of electromagnetic fields using HTML5 Canvas and JavaScript.

## Overview

ElectromagneticField is a dynamic, real-time simulation that brings the invisible world of electromagnetic interactions to life. This project creates an immersive experience where users can explore and manipulate virtual electromagnetic fields, offering both an aesthetic and educational value.

## Features

- Real-time simulation of attractors and repellers

- Interactive mouse-controlled attractor

- Dynamic field lines visualization

- Smooth animations and glow effects

## How It Works

The simulation creates a set of attractors with positive and negative polarities. These attractors interact with each other and influence the movement of field lines. The result is a constantly evolving, visually striking representation of electromagnetic fields.

## Customization

You can easily modify the simulation by adjusting various parameters in the `sketch.js` file:

- `att_num`: Number of attractors

- `att_spd`: Speed of attractor movement

- `segment_length`: Length of each field line segment

- `segment_num`: Number of segments in each field line

- `att_size`: Size of the attractors

Experiment with these values to create different visual effects and behaviors!

## Design Implications

This project demonstrates how complex physical phenomena can be simplified and visualized for better understanding. It showcases:

1. Interactive Data Visualization: Making abstract concepts tangible through user interaction.

2. Real-time Feedback: Immediate visual response to user input enhances engagement.

3. Aesthetic Appeal in Scientific Visualization: Combining accuracy with visual appeal to create an engaging learning experience.

## Potential Applications

- Educational tool for physics classes

- Interactive art installations

- Background visuals for presentations or websites

- Basis for more complex electromagnetic field simulations

## Get Started

Simply open the `index.html` file in a modern web browser to run the simulation. Click and drag to move the interactive attractor, and click to change its polarity.

We encourage you to fork this project, experiment with the code, and create your own unique visualizations!