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)

c5202136f99f4a1fb81ceebc2769da4c

Let's make a face with D3.js!

0 stars0🌍 Public
Kkwanwoo100
Last edited Jun 30, 2020
Created on Jun 30, 2020

A yellow smiley face with animated eyebrows demonstrates basic DOM manipulation with D3.js v5. The code uses `d3.select`, `d3.append`, and `d3.arc` to build SVG elements, while chained `transition().duration(2000)` calls move the eyebrow group up and down. The mouth is drawn as an arc path, and circles and rectangles form the eyes and brows. Static SVG attributes define the geometry, with the entire face centered via a translated group.

AI-generated description

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