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)

394d4d21a0be48a983a447553657cf7b

Let's make a face with D3.js

0 stars3🌍 Public
Ssingularity6033
Last edited Jan 15, 2020
Created on Jan 15, 2020

This example builds a simple cartoon face from basic SVG shapes, including circles for the head and eyes, rectangles for eyebrows, and a path for the mouth. The face is grouped and centered within the SVG canvas. The animation is driven by D3 transitions, which sequentially move the eyebrows downward over two-second intervals. The code uses D3 v5's selection, arc, and transition APIs to construct and animate the elements, with the mouth generated using the `d3.arc` geometry generator to create a curved path.

AI-generated description

A bare minimum HTML page.

See also React Starter.