Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

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

Public visualization

Viewing a saved revision (read-only)

36774b5f070d4c8faaf2678c63b630be

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

0 stars1🌍 Public
PPrathyusha Jampala
Last edited Feb 22, 2023
Created on Feb 22, 2023

This example animates a cartoon smiley face, with its eyebrows repeatedly moving up and down over a two-second cycle. Built using D3.js version 7, it draws the face with SVG shapes, including a yellow circle for the head, black circles for the eyes, and a path for the mouth. The animation relies on D3's `.transition().duration()` method to tween the eyebrow group's `transform` attribute, while the mouth is generated using D3's `arc()` generator. The code demonstrates fundamental DOM manipulation and selection via D3's `select` and `append` functions.

AI-generated description

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