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)

35e2c6315a7248d1a62301f194be36f6

Let's make a face with D3.js!

0 stars1🌍 Public
Ssoniyaa-dv
Last edited Jul 21, 2020
Created on Jul 21, 2020

A yellow smiley face rendered as an SVG in D3.js demonstrates basic DOM manipulation and animation. The face is composed of simple shapes—a circle for the head, two circles for eyes, rectangles for eyebrows, and a path generated with the `d3.arc` function for the mouth. The code uses `d3.select` and `d3.append` to build the hierarchy, with a `transition` animating the eyebrows upward and back over two timed intervals. The example shows how D3 can drive SVG element attributes and transformations.

AI-generated description

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