Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Let's make a face with D3.js!

Public visualization

Viewing a saved revision (read-only)

8eafa8963dbd472ca103e37ec88403c1

Let's make a face with D3.js!

0 stars0🌍 Public
LLouis
Last edited Jan 18, 2019
Created on Jan 18, 2019

A cheerful yellow face emerges from a collection of SVG shapes, with red eyes, gray eyebrows, and a fixed arc-based mouth. The example demonstrates D3.js animation through chained `transition().duration()` calls, which sequentially reposition the eyes and eyebrows to create a subtle, shifting expression. The face is built using primitive SVG elements—`circle`, `rect`, and `path`—positioned relative to a central group, with the mouth defined by the `arc()` helper and its properties for inner and outer radius and angle ranges.

AI-generated description