Skip to content

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

License

Notifications You must be signed in to change notification settings

QC20/ElectromagneticField

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

4 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

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!