Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Learn to draw smile with d3

Public visualization

Learn to draw smile with d3

1 star7🌍 Public
AAjit Singh
Last edited Dec 8, 2020
Created on Dec 8, 2020

An animated smiley face drawn with SVG demonstrates reusable D3 features. Yellow circle, black-outlined head, and eyes are static shapes, while the eyebrows animate through chained `transition.attr` calls that move them up and down over 500ms intervals. The mouth uses the `d3.arc` generator, with a semicircular path defined by inner/outer radii and start/end angles. Coordinates rely on explicit SVG attributes, and the face is centered via a `translate` transform on a group element.

AI-generated description

An example including some commonly used features of SVG.

Comments

Sign in to join the discussion.

MIT Licensed