Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Smiley Face with D3.js

Public visualization

Viewing a saved revision (read-only)

3f61fd58ecda4d0f9a698fc1c1fdde1b

Smiley Face with D3.js

0 stars1🌍 Public
SSyedHamasAli
Last edited Nov 5, 2020
Created on Oct 23, 2020

This example draws a yellow smiley face in an SVG element using D3.js v5. The face consists of a large circle for the head, two smaller circles for eyes, and a mouth created with the d3.arc generator. The code imports `select` and `arc` from the D3 module to manipulate the SVG and construct the curved mouth path. Elements are positioned relative to the center of the SVG using translation transforms, with fixed pixel offsets for eye spacing and mouth placement.

AI-generated description

Yifu's practice on making a smiley face with d3.js

Tutorial: https://www.youtube.com/watchv=_8V5o2UHG0E&t=1220s

Dec. 24, 2019