Skip to main content
SimilarExport ZIP
100%

Face!

✓ Published0🌍 Public
SSadi Hassan
Last edited Jul 22, 2019
Created on Jul 22, 2019

A yellow circle with black facial features forms a simple, animated face. The eyebrows repeatedly rise and lower over the eyes via chained `transition()` calls with a two-second duration. Built with D3 v5, the visualization uses `select`, `arc`, and `attr` on SVG elements, positioning the face’s parts relative to the center of a 500-by-500 viewport.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Face!!

A yellow circle with black eyes, animated rectangular eyebrows, and an arc-shaped mouth forms a simple face on a gray background. The eyebrows slide upward and then return to their original position using chained D3 transitions with a two-second duration. The visualization is built with D3 v6, using `select`, `attr`, and `transition` methods to manipulate SVG elements, while the mouth is drawn with the `arc` generator.

AAtrayeeDeb
94% match
Loading thumbnail…

Making Face

A yellow circle with a black outline forms a face, featuring two eyes, rectangular eyebrows, and a mouth shaped as a semicircular arc. The eyebrows animate by moving upward and back down over two seconds, using D3 transitions. The visualization uses D3 version 6’s `select`, `arc`, and `transition` methods, rendering shapes as SVG elements within a 960x500 viewport. The code constructs the facial features via appended circles, rects, and a path, with the mouth defined by an inner radius of 150 and outer radius of 170.

Jjakenachlas
92% match
Loading thumbnail…

Face

This visualization displays a stylized, cartoon-like face composed of basic geometric shapes: a yellow circle for the head, circles for the eyes, rectangles for the eyebrows, and an arc for the mouth. The face is centered within an SVG canvas. The code uses D3.js v5’s selection and arc functions, and leverages the library’s built-in transition system to animate the eyebrows and mouth, creating a subtle, looping facial expression change.

RRodolfo Dutra
91% match
Loading thumbnail…

Face!

A yellow face with black outlined eyes, animated eyebrows, and a wide open mouth is drawn using SVG. The face is centered in a 960 by 500 pixel viewport, built with D3 selections and shape generators. Eyebrows move up and down through a chain of `transition` calls that alter a `g` element’s `transform`. The mouth uses the `d3.arc` path generator with specified inner and outer radii and angular extents, all rendered as static and animated SVG elements.

RRyan
91% match
Loading thumbnail…

D3 Face

A yellow circle with black outlines forms a face, featuring two eyes, rectangular eyebrows, and a half-circle mouth. The eyebrows animate by moving upward over two seconds and then returning to their original position. The visualization is built with D3 v7, using SVG shapes within a root group, and the mouth is drawn with the `d3.arc` path generator. The animation relies on chained `transition().duration()` calls, offering a simple, playful demonstration of D3's selection and transition methods.

Hhenryspradlin
91% match
Loading thumbnail…

Face

A smiling face drawn with SVG shapes animates its eyes and eyebrows. The yellow circle head contains two black eye circles and rectangular brows that rise and fall via chained transitions, while a mouth arc uses the `d3.arc` helper. The code selects the SVG element, centers a group, and applies `transition.attr` with specified durations to move facial features vertically, demonstrating coordinate transforms and timed animations with D3 v5.

MManoharURK20AI1057
91% match
Loading thumbnail…

A Face with D3.js!

A simple yellow face composed of SVG shapes—a circle for the head, two circles for eyes, and two rectangles for eyebrows—animated with a smooth bobbing motion, while a mouth is drawn as a path using D3’s `arc` generator. The visualization demonstrates D3 v5’s `select` and `transition` APIs to animate the eyebrows’ vertical position over a four-second loop. The face is centered via an SVG group transform in a 960×500 viewport, with all styling applied through inline attributes.

AAnderson Banihirwe
90% match
Loading thumbnail…

Let's make an Face

A yellow face with black outlines and animated eyebrows is rendered in SVG. D3.js v7 builds the facial features by appending a circle for the head, two circles for eyes, rectangles for eyebrows, and a path generated with the `d3.arc` function for the mouth. The eyebrows animate upward and back down using chained `transition().duration(2000)` calls on a group element. Static geometry is positioned via SVG attributes and transforms, with the visualization centered in a 960×500 viewport.

KKelseyXu5
90% match