Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Let's make a face with D3.js!

Public visualization

Let's make a face with D3.js!

0 stars1🌍 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.

Comments

Sign in to join the discussion.

MIT Licensed