Skip to main content
๐ŸŒ Public

Share visualization

Send this visualization to others.

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

Public visualization

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

0 stars0๐ŸŒ Public
NNic Dominguez
Last edited Mar 1, 2021
Created on Mar 1, 2021

A smiley face rendered with SVG demonstrates fundamental DOM manipulation and animation in D3.js. The yellow circle, eyes, eyebrows, and arc-based mouth are constructed using selections and the `d3.arc` generator. The eyebrows move via chained `transition` calls over two-second durations, shifting their group's `transform` attribute up and down. The animation loops by alternating between two translate positions, while the static elements remain fixed. D3 v5 handles the SVG creation and all attribute updates.

AI-generated description

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

Comments

Sign in to join the discussion.

MIT Licensed