100%

Electrical Circuit

✓ Published0🌍 Public

Last edited Apr 10, 2025

Created on Apr 10, 2025

This interactive simulation shows a simple DC electrical circuit with a battery, resistor, LED, wires, and circuit board, along with animated yellow particles representing electron flow. A control panel adjusts voltage and resistance, toggles power, and switches between circuit and 3D views, with current and power readouts updating live. Built with Three.js and OrbitControls, the scene uses WebGL rendering with directional lighting, procedural geometry for components, and real-time animation driven by sliders.

AI-generated description

Electrical Circuit Simulation

This is an interactive 3D electrical circuit simulation that demonstrates the basic components of a simple DC circuit.

Circuit Components

1. Battery

A DC power source that provides voltage to the circuit. It consists of:

Main battery body (gray)
Positive terminal (silver cylinder on top)
Green label

2. Resistor

A component that limits current flow in the circuit. Features:

Brown rectangular body
Four color bands (Black, Red, Gold, Gray) representing resistance value

3. LED (Light Emitting Diode)

A semiconductor device that emits light when current flows through it. Contains:

Red dome (the light-emitting part)
Black cylindrical base
Two metal legs for circuit connections
Glowing effect when powered

4. Wires

Blue conductors that connect all components together, allowing current to flow through the circuit.

5. Circuit Board

Green base board that all components are mounted on.

6. Electrons

Animated yellow particles that represent current flow through the circuit.

Circuit Operation

The battery provides voltage
Current flows through the wires
The resistor limits the current to protect the LED
The LED lights up when current passes through it

You can control the voltage, resistance, and power state using the control panel.

MIT Licensed

Similar vizzes

Loading thumbnail…

Electrical Circuit

This interactive Three.js simulation demonstrates Ohm's law in a 3D electrical circuit, showing how voltage and resistance affect current, power, and animated electron flow. Users adjust sliders and toggle power to observe real-time changes in the circuit's behavior. The scene includes 3D models of a battery, resistor, and LED, with WebGL rendering and orbit controls for perspective viewing. The code relies on the Three.js library for 3D scene management and animation, presenting circuit physics through direct manipulation of electrical parameters.

NNita

87% match

Loading thumbnail…

Fork of Electrical Circuit

This interactive Three.js simulation visualizes an electrical generator circuit in 3D, with adjustable rotation speed, magnetic strength, and resistance parameters. The generator's armature rotates visibly while the LED brightness and real-time voltage, current, and power values update according to Ohm's Law. WebGL rendering provides an animated circuit view with orbiting camera controls, allowing exploration of electromagnetic induction principles through direct manipulation of physics parameters.

NNita

79% match

Loading thumbnail…

Nervous System Simulation

This interactive WebGL visualization depicts a simulated neural network as a glowing three-dimensional mass of branching neurons and curved connections. Users can click any neuron to trigger it, sending luminous signal pulses that travel along quadratic Bézier curve connections to neighboring cells. Built with Three.js and OrbitControls, the scene uses ray casting for neuron selection and an object-pooling system for efficient pulse rendering. A control panel allows real-time adjustment of firing rate, signal speed, and pulse size.

NNita

69% match

Loading thumbnail…

Electric generator

An interactive electric generator simulator demonstrates electromagnetic induction through a rotating coil animation and live sinusoidal voltage waveform. The canvas-based visualization uses HTML5 Canvas API with requestAnimationFrame for real-time rendering, displaying magnetic field lines, coil rotation, and computed electrical parameters including peak voltage, frequency, and magnetic flux. Users adjust speed, magnetic field strength, and coil turns via range sliders, with the waveform updating dynamically according to Faraday's Law calculations. The simulator provides educational insight into AC generator operation through interactive parameter manipulation and immediate visual feedback.

NNita

66% match

Loading thumbnail…

Brain Structure Interactive Explaining Functions of the different parts of the brain

This interactive 3D brain model displays anatomical structures such as the cerebral cortex, cerebellum, and brain stem, with clickable regions that reveal each part’s function in an information panel. Built with Three.js, it uses OrbitControls for rotation and zoom, CSS2DRenderer for labels, and WebGL for rendering. A set of predefined geometric shapes represents the brain regions, adjacent to procedurally placed neuron clusters visualized as simple particles.

NNita

62% match

Loading thumbnail…

circuit

This example shows a grid of logic gates—AND, OR, XOR, NAND, and toggleable ON/OFF gates—arranged in eight columns and rows, with animated pulses of light traveling along the wires between them as signals propagate. Users can click any gate to cycle its type, while the leftmost column flips between ON and OFF, triggering cascading updates. Built with D3.js, the visualization renders the gates and wires as SVG, using transitions to animate color and stroke changes. The code uses d3 scales, nests, and transitions, along with lodash helpers for data manipulation, to coordinate the circuit’s behavior. Are there any errors in the above? If so, highlight them and explain what is wrong. Make sure the final description is 2-4 sentences, 60-120 words. Need to carefully verify the code, not blindly trust it. Let's work through the code step-by-step, comparing the description's claims with the actual code. We need to say what it shows before how it works, and use concrete d3 APIs. Let's break down the code to verify each claim. The title is "circuit". It's an SVG animation. The code renders a grid of gates (8x8) connected by wires. The gates are logic gates (AND, OR, XOR, NAND) plus ON/OFF in the first column. Clicking a gate changes its type. There's an interval that randomly toggles the first column. The description must be 2-4 sentences, 60-120 words. Present tense, third person. Say what it shows before how it works. Name concrete libraries and APIs (`d3.forceSimulation` is not used; it uses `d3.range`, `d3.nest`, `d3.scale.linear`, selections, transitions, and the `d3-jetpack` and `d3-starterkit` libraries). Let's craft a description. It's a grid of logic gates that propagate signals. Wires show connections. Clicking toggles types. Animations show pulses. Need to mention D3 and the specific APIs used: d3.scale.linear, d3.nest, transitions, and possibly the helper libraries d3-jetpack and d3-starterkit. The prompt says "Name the concrete libraries and APIs the code uses (d3.forceSimulation, d3.geo...)." So I should name them. The text should be 2-4 sentences, 60-120 words. Present tense, third person. What it shows before how it works. Let's craft. First sentence: what it shows. An 8x8 grid of logic gates connected by wires, animating signal propagation. Then how it works: uses D3 and lodash, with SVG paths and transitions. Keep concise. Ensure 60-120 words. Let's write.This interactive visualization shows an 8x8 grid of logic gates connected by wires, with signals animating through the circuit. The gate types (AND, OR, XOR, NAND) are randomly assigned, except the first column which toggles between constant ON and OFF states. Clicking a gate cycles its type, and the circuit recalculates, with pulses of light traveling along the wires to show the propagation of signals. The example is built with the D3 library, using SVG for rendering and transitions to animate the flow of data through the circuit. It relies on D3’s data joins, scales, and transition methods to handle the grid, wire routing, and animations, with helper functions from lodash and d3-jetpack for data manipulation and DOM selection.

11wheel

62% match

Loading thumbnail…

Atoms and electrons 3D

This interactive 3D visualization shows the structure of an atom, with a glowing gold nucleus at the center and electrons arranged in three distinct shells colored green, blue, and pink. Using Three.js with WebGL rendering, it displays 18 electrons total—2 in the inner shell, 8 in the middle, and 8 in the outer shell—with each shell rotating at a different speed to simulate orbital motion. The scene includes directional and point lighting to make the electrons appear luminous, and users can rotate, zoom, and pan the camera through OrbitControls. The animation loop continuously updates the shell rotations each frame.

NNita

62% match

Loading thumbnail…

Fork of Atoms and electrons 3D

A 4×4×4 cube of 64 color-coded spheres rotates slowly in 3D space, demonstrating a lattice-like arrangement of electrons or atoms. Built with Three.js, the scene uses a WebGL renderer and OrbitControls for interactive camera rotation and zoom. Each sphere’s hue is derived from its grid position via HSL color mapping, with directional and ambient lighting illuminating the structure. The animation loop continuously rotates the entire group while the camera remains user-controllable.

NNita

61% match