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)

281fec063e6e4bd0b66faa5c5ae8a114

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

0 stars0🌍 Public
Ddeepakalevoor2
Last edited May 2, 2021
Created on May 1, 2021

This example demonstrates fundamental DOM manipulation with D3.js by constructing a yellow smiley face with eyes, eyebrows, and a mouth. The face is drawn using SVG elements, including circles for the face and eyes, rectangles for eyebrows, and a path created with the `d3.arc` function for the mouth. The entire composition is centered using an SVG `g` element and translated coordinates. The only animated behavior is a 2000-millisecond `transition` that moves the eyebrow group upward by 50 pixels and then back to its original position, creating a simple blinking or raising motion.

AI-generated description

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