Skip to main content
100%

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

✓ Published0🌍 Public
DDavit Avetikyan
Last edited Aug 2, 2021
Created on Aug 2, 2021

This example shows a yellow smiley face built entirely from SVG shapes using D3.js v5, with animated eyebrows that move up and down in a repeating two-step transition. The face is composed of a circle, two eye circles, and a mouth drawn as an arc path via the `d3.arc` helper, all centered within an SVG canvas. The code demonstrates fundamental DOM manipulation by appending groups and elements with `select`, `append`, and `attr`, while the eyebrow motion relies on chained `transition().duration().attr()` calls to repeatedly shift their vertical position. No external data source is used; the visualization is purely programmatic.

AI-generated description

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

MIT Licensed

Similar vizzes