Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Let's make a face with D3.js!

Public visualization

Let's make a face with D3.js!

0 stars1🌍 Public
KKevinw97
Last edited Jan 17, 2020
Created on Jan 17, 2020

This visualization uses D3.js to construct a simple smiley face from SVG shapes, including a yellow circle for the head, paired eyes, and an arc-based mouth. It demonstrates fundamental DOM manipulation by appending elements to a centered group. The code defines geometric constants for spacing and sizing, then uses chained `transition` calls with a two-second duration to animate the rectangular eyebrows moving up and down. Rendering is done entirely through SVG attributes set via D3 selections, with no external data source, highlighting basic shape creation and animation techniques in d3 v5.

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