Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Fork of Let's make a face with D3.js!

Public visualization

Fork of Let's make a face with D3.js!

0 stars1🌍 Public
SSiva Srinivasa Reddy Yakkanti
Last edited Feb 12, 2025
Created on Feb 12, 2025

This example shows a smiley face drawn with SVG primitives in D3.js v5, featuring a randomly colored face, fixed eyes, and a curved mouth. It demonstrates fundamental DOM manipulation by appending circles and a path directly to an SVG container. A button triggers a color change, using `transition().duration(500).attr('fill', ...)` to animate the face’s fill to a new random HSL value generated by `getRandomColor()`. The code relies on D3’s selection and transition APIs without any external data source.

AI-generated description

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

Comments

Sign in to join the discussion.

MIT Licensed