Fork of Double Harmonic

100%

Fork of Double Harmonic

✓ Published0🌍 Public

Last edited Apr 30, 2021

Created on Apr 30, 2021

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.

AI-generated description

Double Pendulum inspired by sisyphus table.

MIT Licensed

Similar vizzes

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

92% 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

92% match

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

91% 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

91% 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

85% match

Loading thumbnail…

Double Harmonic

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.

Wwgloss

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

82% match

Loading thumbnail…

Fork of Fork of Double Harmonic Black and white

A web document displays a black-and-white composition of fifteen circles, all centered on a large, static canvas and rendered with an SVG. The circles are overlaid at the same center point, each with a fixed radius, creating a layered, harmonic pattern inspired by a double pendulum. The code uses d3.select to append an SVG element, d3.range to generate the data, and d3.enter to create the circle elements, with dimensions based on window.innerWidth and window.innerHeight.

Xxani

75% match