Skip to main content
SimilarExport ZIP
100%

Testing

✓ Published4🌍 Public
PPedro Ernesto Tramontina
Last edited Mar 24, 2020
Created on Mar 24, 2020
Forked from HTML Starter

A yellow circle with two eyes and a mouth is drawn in SVG, its eyebrows bobbing up and down in an animated loop. The code builds the face from basic shapes using D3 v5, applying chained `transition` calls to animate the eyebrow group's vertical transform. Rendering is done entirely in SVG, with the mouth formed by D3's `arc` shape generator.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

D3 test

This example shows a simple yellow face built from SVG shapes, with eyes that blink through a repeating eyebrow animation and a smiling arc-shaped mouth. The code uses D3 v6 selections to append circles, rectangles, and a path to an SVG canvas, while the mouth is drawn with the `d3.arc` helper. A two-stage `transition` chain animates the eyebrows downward and back, demonstrating chained timing. The face is centered using an SVG transform, and static styling comes from the included stylesheet.

Vvmoharir
91% match
Loading thumbnail…

Making a face

A yellow circle face with two eyes and eyebrows is rendered in SVG, with the right eyebrow animating upward and downward over two seconds. The mouth is drawn as a half-circle arc using the `d3.arc` helper. Built with D3 v5, the code uses `select`, `attr`, and chained `transition` calls to control the animation, positioning elements via SVG transforms.

Rrcumani
90% match
Loading thumbnail…

Using SVG and D3

A yellow circle with black outline forms a face, featuring two dark eyes and animated eyebrows that raise and lower over time, alongside a curved mouth drawn as an arc. The SVG is centered within a 960 by 500 viewport, built entirely with D3 v5’s `select`, `append`, and `arc` APIs, using chained `transition` calls to animate the right eyebrow’s vertical position over two-second intervals.

NNoWizards
89% match
Loading thumbnail…

Image Test

A smiling yellow face with black eyes, eyebrows, and a mouth is drawn in the center of an SVG canvas using D3 v5. The eyes are circles, the eyebrows are rectangles, and the mouth is an arc path created with the `arc` generator. The eyebrows animate vertically via chained `transition.attr` calls, moving downward and then returning to their original position over two seconds each way. The svg is selected and manipulated directly with D3 selections, and the face is centered using a translated group element.

Aanvesh12
89% match
Loading thumbnail…

making a face

A yellow circle with black features forms a simple face, with two eyes and a mouth drawn using an SVG path. The eyebrows are animated rectangles that move down and back up over four seconds. The visualization uses D3 v6 selections to append SVG shapes and the `arc` generator from D3 to create the mouth path. The `transition` method handles the eyebrow animation, while the SVG coordinate system positions features around a central group.

Jjwu534@gmail.com
88% match
Loading thumbnail…

This is a test page.

A smiling face is drawn with D3.js and its eyebrows animate up and down. The face is built by appending SVG shapes—a yellow circle, two eye circles, rectangular eyebrows, and an arc-based mouth—to a central group. The eyebrows move via chained `transition().duration()` calls that toggle their vertical position. The code uses D3 v5 and imports `select` and `arc` from the `d3` module, with the entire animation rendered directly in SVG.

BBrian Merchant
88% match
Loading thumbnail…

SVG Face

A smiling yellow SVG face with animated eyebrows demonstrates basic D3 shape and transition techniques. The face is centered using SVG groups and transforms, with circles for eyes, rectangles for eyebrows, and a path generated by D3’s `arc` function for the mouth. The eyebrows move upward and return via chained `transition().duration()` calls. The example uses d3-v5 select and arc APIs to build the static face and animate its expressions purely through SVG attribute interpolation.

Rrams211
88% match
Loading thumbnail…

SVG Face

A smiling yellow SVG face with animated eyebrows demonstrates basic D3 shape and transition techniques. The face is centered using SVG groups and transforms, with circles for eyes, rectangles for eyebrows, and a path generated by D3’s `arc` function for the mouth. The eyebrows move upward and return via chained `transition().duration()` calls. The example uses d3-v5 select and arc APIs to build the static face and animate its expressions purely through SVG attribute interpolation.

Rrams211
88% match