Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Fork of Sine function-a little animation

Public visualization

Viewing a saved revision (read-only)

3044d0be6d7240f182fa8dc397a3ca1d

Fork of Sine function-a little animation

0 stars0🌍 Public
GGiorgi Xiaoyu Zhang
Last edited Dec 30, 2022
Created on Dec 30, 2022

This example animates a fork of a sine function, where a set of circles transitions vertically to follow a sine wave’s values. The visualization uses D3 v6 to render SVG circles, with each circle’s vertical position determined by the sine of its index, scaled by a pixel factor. The animation applies a 3-second transition to the `cy` attribute, while randomizing each circle’s radius and fill color using `Math.random()`. The code leverages D3’s `select`, `range`, and `transition` APIs to build and animate the chart on a full-window SVG canvas.

AI-generated description