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)

9f90cf7e645f41e1a72b1f2964f0128d

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

0 stars0🌍 Public
HHarshavardhan
Last edited Feb 25, 2023
Created on Feb 25, 2023

This example demonstrates a smiley face drawn with D3.js, featuring animated eyebrows that move up and down in a looping transition. The face is constructed using SVG primitives, with a yellow circle for the head, two eye circles, and a mouth path generated with the `arc` function. The code imports `select` and `arc` from D3 v5, explicitly setting dimensions from the SVG attributes and centering a group element. The eyebrows are rectangular shapes within a nested group, animated via chained `transition` calls that adjust their vertical position over two-second intervals.

AI-generated description

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