Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

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

Public visualization

Viewing a saved revision (read-only)

4f1a1eb98c0d4a399bd00fed755de10c

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

0 stars0🌍 Public
Pprachow
Last edited Feb 23, 2023
Created on Feb 22, 2023

A smiling yellow face animates against a black background, with blue rectangular eyebrows that bounce upward and downward, a red-outlined mouth, white teeth that rotate side to side, and a tongue. The code builds the face using D3.js v5 selections and the `d3.arc` shape generator, appending SVG circles, rects, and paths to a 1000x500 canvas. Multiple `transition().duration()` calls drive the eyebrow movement and teeth rotation, while static elements like eyes, nose, and mouth are positioned via SVG transforms.

AI-generated description

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