Skip to main content
SimilarExport ZIP
100%

Lets make a face

✓ Published0🌍 Public
AAbdulazizfh
Last edited Jan 27, 2021
Created on Jan 27, 2021

A yellow face with black-outlined features animates its eyebrows in a repeating bounce, rising and falling over two-second intervals. The face is built with D3 selections and SVG shapes: a circle for the head, two circles for eyes, rectangles for eyebrows, and a path generated with the D3 `arc` generator for the mouth. The entire composition is centered within an SVG canvas using a translated group, and the eyebrow motion is controlled by chained D3 transitions that alternate the group's vertical position.

AI-generated description

1

MIT Licensed

Similar vizzes

Loading thumbnail…

Lets make a face!!!!!

A yellow circular face with black eyes, eyebrows, and an arc-shaped mouth is drawn in the center of an SVG canvas. The eyebrows animate vertically, moving up and down repeatedly using D3 transitions with a 1000-millisecond duration. The face is assembled from SVG primitives including `circle`, `rect`, and `path` elements, with the mouth generated via the `d3.arc` function. The code uses d3-selection to append elements and d3-transition to animate the eyebrow group's transform attribute.

JJoshuaBruens
91% match
Loading thumbnail…

Let's Make a Face

A yellow circle face with black outlined features animates its eyebrows up and down. The visualization builds the face using d3.svg append operations, positioning circles for eyes, rectangles for brows, and a d3.arc path for the mouth. The eyebrows transition vertically via d3.transition. The SVG face is centered using a translated group, with all coordinates computed from the viewport dimensions.

IIcecreamneverfall
90% match
Loading thumbnail…

Let's Make a Face

A yellow circle face with black outlined features animates its eyebrows up and down. The visualization builds the face using d3.svg append operations, positioning circles for eyes, rectangles for brows, and a d3.arc path for the mouth. The eyebrows transition vertically via d3.transition. The SVG face is centered using a translated group, with all coordinates computed from the viewport dimensions.

IIcecreamneverfall
90% match
Loading thumbnail…

Let's make a face

A yellow circle with a black outline forms a face, featuring two black eyes and an arc-shaped mouth drawn using d3.arc. The animation uses D3 transitions to make the left eyebrow move up and down repeatedly, while the right eyebrow remains static. Built with D3 v6, the visualization manipulates SVG elements like circle, rect, and path, with all positioning centered via SVG coordinate transforms.

SSven Wanner
90% match
Loading thumbnail…

Let's Make a Face!

This visualization shows a simple, stylized face constructed from basic SVG shapes, including a yellow circle head, black circular eyes, red arc mouth, and rectangular eyebrows. A smooth, repeated animation moves the eyebrows upward and back down over two seconds, creating an expressive effect. Built using D3 v5, the code leverages SVG primitives and D3’s transition API to animate the eyebrow group’s transform property. The face is centered using a translated group, and the mouth is drawn with a d3.arc path generator.

AAndres Bizzarri
90% match
Loading thumbnail…

Let's make a face!

A yellow circle with a black outline, two dark eyes, and an arc-shaped mouth form a simple face. The eyebrows, drawn as rectangles, move up and down in a looping animation using D3's transition system. The SVG is generated with the `select`, `append`, and `arc` APIs, and the eyebrow movement is orchestrated with the `transition().duration()` and `.on("end", ...)` methods to repeat the motion. The face is centered in a 960x500 SVG canvas using a group transform.

MMatan
90% match
Loading thumbnail…

Let's Make a Face

A yellow circle face with black eyes and animated eyebrows is drawn using SVG. The eyebrows move up and down through chained transitions that alternate their vertical offset. D3 v6's `select`, `arc`, and `transition` APIs construct the face, with the mouth rendered as an arc path and eye positions set via fixed coordinates.

BbeauMarko
90% 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
90% match