Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Let's make a face with D3.js!

Public visualization

Viewing a saved revision (read-only)

44183c34a13b4d6a8164ab69ae71b860

Let's make a face with D3.js!

0 stars0🌍 Public
MMartin Lord
Last edited Apr 15, 2020
Created on Apr 15, 2020

A yellow smiley face is drawn with SVG shapes, including a circle head, two eyes, and an arc-based mouth, all centered via a transformed group. D3.js v5 selections append and style these elements, while a chained `transition` with `duration` settings animates the entire eyebrow group upward and then back down, making the expression shift. The example highlights basic DOM manipulation and transition timing with `select` and `arc`.

AI-generated description

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