Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

New Fork of Create Smiley with D3.js!

Public visualization

Viewing a saved revision (read-only)

ba08de395ae04b5e9aa3ee627202c0ae

New Fork of Create Smiley with D3.js!

0 stars0🌍 Public
JJacob Bechtel
Last edited Aug 18, 2021
Created on Aug 18, 2021

A D3.js smiley face animates its eyebrows upward and back down in a looping two-second transition. The SVG scene is built with D3 selections and shapes: circles for the eyes, rectangles for the eyebrows, and an arc-generated path for the mouth. The code uses `d3.select` and `d3.arc` within a React component, with `transition().duration(2000)` applying the eyebrow movement. Data is not loaded from an external source; the face is defined entirely by hardcoded dimensions and coordinates.

AI-generated description

Demonstrates fundamental DOM manipulation using D3.js by making a smiley face whose eyebrows move.