A mesmerizing interactive visualization of electromagnetic fields using HTML5 Canvas and JavaScript.
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.
- Real-time simulation of attractors and repellers
- Interactive mouse-controlled attractor
- Dynamic field lines visualization
- Smooth animations and glow effects
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.
You can easily modify the simulation by adjusting various parameters in the sketch.js
file:
att_num
: Number of attractorsatt_spd
: Speed of attractor movementsegment_length
: Length of each field line segmentsegment_num
: Number of segments in each field lineatt_size
: Size of the attractors
Experiment with these values to create different visual effects and behaviors!
This project demonstrates how complex physical phenomena can be simplified and visualized for better understanding. It showcases:
- Interactive Data Visualization: Making abstract concepts tangible through user interaction.
- Real-time Feedback: Immediate visual response to user input enhances engagement.
- Aesthetic Appeal in Scientific Visualization: Combining accuracy with visual appeal to create an engaging learning experience.
- Educational tool for physics classes
- Interactive art installations
- Background visuals for presentations or websites
- Basis for more complex electromagnetic field simulations
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!