Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

19_ cheap tricks for interaction D3.js!

Public visualization

19_ cheap tricks for interaction D3.js!

0 stars0🌍 Public
FFMajid-ops
Last edited Dec 18, 2020
Created on Dec 18, 2020

The example shows a yellow SVG smiley face with two eyes and a mouth, rendered using D3.js shape generators and SVG primitives. The code builds the face by appending circles, rectangles, and a path created with the `arc` generator to an `<svg>` element. It demonstrates simple animation where the eyebrows, drawn as rectangles, move upward and then return to their original position using chained `transition` calls with a duration of 2000 milliseconds each. The face is centered by translating a group element, with fixed numeric values controlling eye spacing, eyebrow size, and mouth radius.

AI-generated description

Comments

Sign in to join the discussion.

MIT Licensed