Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Face

Public visualization

Face

0 stars1🌍 Public
TTsing
Last edited Nov 11, 2019
Created on Nov 11, 2019

This example shows a simple yellow face built from SVG shapes, with a mouth and eyes, whose pink cheeks animate by briefly moving downward and then returning to their original position. The visualization is rendered as a static SVG canvas, with the face centered and scaled to the viewport. The code generates the geometry using D3 v5, constructing circles for the face, eyes, and cheeks, and a path for the mouth via the `d3.arc` function. The cheek animation is driven by chaining D3 transitions, which adjust the `cy` attribute over a set duration.

AI-generated description

An example including some commonly used features of SVG.

Comments

Sign in to join the discussion.

MIT Licensed