Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Fork of D3-1: Making a face

Public visualization

Viewing a saved revision (read-only)

7c8b5d48c6084543917e87fb080aa308

Fork of D3-1: Making a face

0 stars0🌍 Public
Bbarryhillier
Last edited Jan 9, 2023
Created on Jan 9, 2023
Forked from D3 Starter

This example animates a simple face by repeatedly redrawing a set of circles, whose vertical positions are derived from a sine wave, to create a wavy, shifting expression. The visualization uses the D3 v7 library with a selection-based API (`d3.select`, `d3.range`) to build an SVG scene of circles at fixed horizontal intervals inside a dynamically sized viewport. The animation is driven by a JavaScript `setInterval` timer that updates the circle data every second, a time counter `t` shifting the sine-based y-coordinates, and uses D3’s `.enter()` to append circles that persist across frames.

AI-generated description