Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Fork of Let's Make a Face Part I

Public visualization

Viewing a saved revision (read-only)

7982df49d4304533952297def28c2384

Fork of Let's Make a Face Part I

0 stars0🌍 Public
Rrishyossarian
Last edited Dec 21, 2021
Created on Dec 21, 2021

This example shows a stylized smiley face built from three reusable SVG components: a yellow background circle, a pair of eyes, and a mouth drawn as an arc. The face is positioned at the center of a 1060×500 SVG canvas using React components that receive geometry props for radii and offsets. The mouth path is generated with d3.arc(), while BackgroundCircle and Eyes render plain SVG circle elements. React 16.9 and D3 v7 work together, with all drawing handled declaratively through JSX.

AI-generated description

Half way towards a smiley face.