Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Lukes Face

Public visualization

Viewing a saved revision (read-only)

88615d82d22c45409ec6ca3ffe4b0a3d

Lukes Face

0 stars0🌍 Public
LLuke Collymore
Last edited May 14, 2022
Created on May 14, 2022

A smiling face is rendered using D3.js, with its two rectangular eyebrows animating upward and then returning to their original position in a repeated cycle. The face is constructed from SVG shapes: a blue circle for the head, two circles for the eyes, and an arc for the mouth, all positioned within a centered group. The animation is achieved through chained `transition` calls on the eyebrow group, using D3's `.transition().duration()` and `.attr()` methods. The example demonstrates basic DOM manipulation and animation in D3 v5.

AI-generated description

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