Double Harmonic

100%

Double Harmonic

✓ Published7🌍 Public

Last edited Apr 6, 2021

Created on Apr 6, 2021

Two concentric pendulum arms trace a slowly evolving path. A large circle rotates around the center, and a smaller circle rotates around it, creating a complex harmonic motion. The visualization uses SVG elements, including circles and lines, and is updated at a fixed interval. The code employs D3’s `select`, `range`, and data join methods to render the animation, based on the `d3` library version 6.

AI-generated description

Double Pendulum inspired by sisyphus table.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Double Harmonic

A double pendulum is drawn as two black line segments connected by a dark circle, with a white ring tracing the path of the second mass against a full-screen SVG. The animation runs on a 50-millisecond timer, updating the pendulum’s position based on trigonometric functions of a time variable. It is rendered with D3 v6, using `select`, `range`, and `join` operations to create and update the `line` and `circle` elements. The pendulum’s motion follows a classic two-arm harmonic pattern with a fixed frequency ratio.

Wwhiteswallow87

87% match

Loading thumbnail…

Fork of Double Harmonic

A two-link pendulum traces a spherical path as two connected circles rotate around a fixed center point. The animation uses `setInterval` to update the positions every 50 milliseconds, with the second circle’s motion offset by a constant psi value that creates the harmonic fork effect. The SVG rendering uses `selectAll` and `join` to update circle and line elements, applying black strokes for the pendulum arms and a white circle with a black border for the joint. The visualization responds to browser window dimensions, setting its size based on `window.innerWidth` and `window.innerHeight`.

TTehran Mammadov

86% match

Loading thumbnail…

Fork of Double Harmonic

A double pendulum animation built with D3.js v6 renders a black tracing line and white ball in SVG. The code uses `select`, `range`, and `setInterval` to update circle and line positions at each tick, computing the pendulum’s path from cosine and sine functions with a fixed psi ratio. The full-screen SVG shows two connected rods and the swinging tip, with ball radius and arm lengths as constants.

Wwgloss

84% match

Loading thumbnail…

Fork of Double Harmonic Black and white

A black-and-white animated line traces a double pendulum motion, with two connected arms sweeping from a fixed center point and a small circle riding at the tip. The circle alternates between white and black fills while a larger shadow circle follows underneath. The animation updates every 50 milliseconds using JavaScript’s `setInterval`, and d3 v6 selection methods like `selectAll`, `data`, and `join` bind new positions to SVG `<line>` and `<circle>` elements.

Wwgloss

84% match

Loading thumbnail…

Fork of Double Harmonic

This example shows a double pendulum animation, drawing a small ball as the endpoint of two connected, rotating line segments. The code uses d3.js v6 with a time-driven `setInterval` loop to update the pendulum's position based on a constant time step and a phase-shift ratio (`psi`). It renders the scene as SVG, creating the arm lines, a moving ball, and a large hollow circle marker at the endpoint. The visualization demonstrates the harmonic motion of the two-segment system.

Ggiulius540

84% match

Loading thumbnail…

harmonic test

An animated double pendulum traces two connected line segments from a fixed center point, with a white ball at the endpoint whose radius oscillates with time. The tip alternates between white and black fills each time step, creating a strobe effect. Using D3 v6 selections, `range`, and `join`, the code updates SVG `line` and `circle` elements every 2 seconds, incrementing a time variable to drive cosine and sine positions for both arm segments.

DdvirRez

84% match

Loading thumbnail…

Fork of Double Harmonic

This example animates a double pendulum system, tracing the motion of two connected masses as they swing around a fixed center point. The code uses `d3.select` to create SVG circles and lines, updating their positions every frame with `setInterval` and `range(1)` to compute the pendulum’s coordinates. It relies on D3 v6’s data joins (`selectAll` and `join`) to render the moving balls, connecting rods, and shadow markers, with an animation loop that advances the angle `t` and the ratio `psi`.

KKerim

83% match

Loading thumbnail…

Double Harmonic

Two circles bounce between expanding and contracting in a loop, with one radius derived from a random integer and the other responding inversely to it. Built with D3 v6, the animation uses `setInterval` to regenerate data and update SVG circle attributes `r`, `cx`, and `cy` every 100 milliseconds. The `ball2radiusMaker` function toggles the second circle’s size based on whether the random value exceeds the midpoint, creating a visual counterpoint. The code reads as an algorithmic sketch inspired by Sol LeWitt’s geometric rules.

Wwgloss

79% match