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)

9ba2d3b3188a4a6a8a34dc37da5a8963

Let's make a face with D3.js!

0 stars4🌍 Public
Fforcox43
Last edited Jun 8, 2020
Created on May 30, 2020
Forked from HTML Starter

This example draws a smiling yellow face out of SVG shapes using D3.js v5. It constructs a circle for the head, two circles for eyes, rectangles for eyebrows, and an arc path for the mouth, all centered on an SVG canvas. The eyebrows animate upward and back down over four seconds using chained `transition` calls with a two-second duration each. The code relies on D3’s `select` and `arc` functions to build the scene entirely from static attributes, with no external data source.

AI-generated description

A bare minimum HTML page.

See also React Starter.