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)

231ed838974b459b88ee6674c12dfcc0

Let'S make a face with D3.js

0 stars1🌍 Public
AArnaud Gbaguidi
Last edited May 19, 2020
Created on May 19, 2020

This example uses D3.js v5 to construct an animated face entirely from SVG primitives. It draws a yellow circle for the head, adds two black eyes and rectangular eyebrows, then creates a mouth using an `arc()` path generator. The eyebrows are animated with a two-second `transition()` that shifts them up and down before returning to their original position. The code relies on D3's `select`, `append`, and attribute methods to build and manipulate the SVG scene.

AI-generated description

An example including some commonly used features of SVG.