Viewing a saved revision (read-only)
cf113726733e4597b775f0f1e32dd5ce
Let's make a face with D3.js!
This example uses D3.js v5 to build a smiling face from basic SVG shapes, including a yellow circle for the head, black circles for the eyes, rectangles for the eyebrows, and an arc for the mouth. The code demonstrates fundamental DOM manipulation by selecting the SVG element, appending groups, and positioning shapes with the `attr` method. Eyebrows animate by using chained `transition().duration(2000)` calls to move their group vertically, first upward and then back to the original position. The example highlights D3’s `select` and `arc` APIs for creating and transforming visual elements.
AI-generated descriptionDemonstrates fundamental DOM manipulation using D3.js by making a smiley face whose eyebrows move.