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)

6a9b258008d04a09adcfc30dc4e38008

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

0 stars0🌍 Public
Ppranatiyv
Last edited Feb 21, 2022
Created on Feb 21, 2022

This example builds a silver smiley face in SVG using D3.js v5, with a yellow stroke and animated eyebrows that move up and down over two-second transitions. The code selects the SVG element, appends a group centered on the canvas, and constructs facial features including circles for eyes, rectangles for eyebrows, and a path generated with `d3.arc` for the mouth. The eyebrows transition their vertical position using chained `transition.attr` calls, demonstrating fundamental DOM manipulation and animation with D3’s selection and transition APIs.

AI-generated description

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