Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Let's make a smiley face with D3.js

Public visualization

Let's make a smiley face with D3.js

0 stars2🌍 Public
VVeena Muralidharan
Last edited Aug 14, 2019
Created on Aug 14, 2019

A yellow smiley face is drawn in SVG using D3.js v5, with a circle for the head, two eyes, rectangular eyebrows, and an arc-based mouth generated with the `arc` helper. The eyebrows animate vertically via chained `transition().attr()` calls, moving down then returning over four seconds. The SVG dimensions are read directly from the markup, and the face is centered using a translated `<g>` group. The example demonstrates basic SVG shape creation and D3 transitions.

AI-generated description

An example including some commonly used features of SVG.

Comments

Sign in to join the discussion.

MIT Licensed