Skip to main content
100%

Let's make a face with D3.js!

✓ Published1🌍 Public
MMorten Kjølstad Dybo
Last edited Nov 15, 2019
Created on Nov 15, 2019

A smiling yellow face rendered in SVG uses circles for the eyes and head, rectangles for animated eyebrows, and a path for the mouth. The eyebrows move via chained D3.js transitions, shifting their vertical position over two seconds and then snapping back. The example demonstrates fundamental DOM manipulation using D3.js v5’s `select` and `append` functions, with coordinates calculated from the SVG’s dimensions. The animation runs automatically on page load.

AI-generated description

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

MIT Licensed

Similar vizzes