Skip to main content
100%

Let's make a face with D3.js!

✓ Published2🌍 Public
AArthur Welf
Last edited Apr 30, 2019
Created on Apr 30, 2019

Built with D3.js v5, this animated SVG draws a yellow smiley face with circular eyes, a curved mouth, and rectangular eyebrows. The eyebrows continuously move up and down using chained `transition()` calls with `attr` updates, demonstrating fundamental DOM manipulation through selections like `select` and `append`. The code constructs the face using SVG primitives—circles, rects, and a path generated by the `arc()` generator—within a group translated to the canvas center. The example showcases D3 transitions and shape generation without requiring any external data.

AI-generated description

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

MIT Licensed

Similar vizzes