Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Let's Make a face with D3 !

Public visualization

Viewing a saved revision (read-only)

8a8ea14db89147d2bdc3ccff4ec21cc1

Let's Make a face with D3 !

0 stars0🌍 Public
CCao,Zhuo
Last edited Apr 8, 2020
Created on Apr 8, 2020

This example animates a simple smiling face built entirely with D3 shapes. The face consists of a yellow circle, two black eyes, and a curved mouth created using the `d3.arc` path generator. Eyebrows animate with two sequential `transition().duration()` calls, first moving upward and then rotating via `attr('transform', rotate())`, while the face is centered using SVG group transformations. The code uses D3 v5 selections and transitions on SVG elements, with all coordinates computed from the SVG’s height and width attributes.

AI-generated description