Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Let's make a face with D3.js!

Public visualization

Viewing a saved revision (read-only)

4b3928ffe7b0483baa8e53eb91a5e98e

Let's make a face with D3.js!

0 stars1🌍 Public
Mmirna981
Last edited Oct 10, 2019
Created on Oct 10, 2019

A yellow smiley face is drawn with D3.js, featuring circular eyes, a curved mouth, and rectangular eyebrows that animate upward and back in a looping motion. The example demonstrates fundamental SVG DOM manipulation by selecting an `<svg>` element and appending grouped shapes with `d3.select` and `append`. It uses D3's `arc` generator to create the mouth path and `transition().duration()` to move the eyebrows and mouth, with attributes like `attr` and `translate` transforms controlling position and animation.

AI-generated description

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