Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Fork of Let's make a face with D3.js!

Public visualization

Viewing a saved revision (read-only)

f00fbdef4a4a4679b3a9f23e4a5dda9c

Fork of Let's make a face with D3.js!

0 stars0🌍 Public
SSupratim Sarkar
Last edited Sep 21, 2022
Created on Sep 21, 2022

This example demonstrates fundamental D3.js DOM manipulation and animation by constructing a smiley face from SVG primitives. It shows a yellow circle with eyes, eyebrows, and an arc-shaped mouth, while the eyebrows animate upward and then return to their original position using sequential `transition` calls over four seconds. The visualization also incorporates interactive zooming and panning via `d3.zoom`, allowing users to scale and translate the face by mouse or touch gestures, with a click resetting the view to its initial state.

AI-generated description

Demonstrates fundamental DOM manipulation using D3.js by making a smiley face whose eyebrows move.