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)

bfec76982a19470e9e871624649c0f2c

Let's make a face with D3.js!

1 star1🌍 Public
Llujinxuan-fang
Last edited Mar 8, 2020
Created on Mar 8, 2020
Forked from HTML Starter

This example uses D3.js v5 to build an animated face from basic SVG shapes within a React framework. The code draws a yellow circle as the face, adds two eyes with matching eyebrows, and constructs a mouth using the D3 `arc` path generator with specific inner and outer radii. Eyebrows animate via chained `transition()` calls, moving upward and back down over a two-second duration. The SVG canvas is 960×500 pixels, with all elements positioned relative to a centered group using translation transforms.

AI-generated description

A bare minimum HTML page.

See also React Starter.