Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

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

Public visualization

Viewing a saved revision (read-only)

2b5fe945ae254869b980bc8ad925d641

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

0 stars0🌍 Public
NNiharika Reddy Amanaganti
Last edited Feb 24, 2023
Created on Feb 24, 2023

A yellow smiley face with animated eyebrows demonstrates DOM manipulation with D3.js v5. The face is built using SVG primitives: a circle for the head, two circles for eyes, rectangles for brows, and a path generated with the `d3.arc` function for the mouth. Eyebrows move up and down through chained `transition().duration()` calls that change the group's transform attribute. The code imports `select` and `arc` from D3, sets coordinates dynamically from SVG dimensions, and runs entirely in the browser at 960x500 resolution.

AI-generated description

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