Skip to main content
SimilarExport ZIP
100%

Fork of Fork of SAD

✓ Published0🌍 Public
Jjayanth1242
Last edited Sep 22, 2023
Created on Sep 22, 2023
Forked from Fork of SAD

A yellow circle face with black eyes and animated eyebrows blinks periodically in an SVG. The example demonstrates D3 v7 selections and transitions, using `select` to target the SVG and `append` to build the face from circles, rectangles, and an arc-based mouth. Eyebrows move via chained `transition` calls with `duration`. The code imports `select` and `arc` from the D3 module loaded via UNPKG, rendering entirely in SVG.

AI-generated description

An example showing the capabilities of VizHub:

  • Loads D3 via UNPKG.
  • Demonstrates use of import from "d3".
  • Demonstrates use of import from local ES6 modules.
MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of SAD

This example animates a yellow, smiling face drawn entirely with SVG shapes, including circles for the eyes and head, rectangles for the eyebrows, and a path for the mouth. The eyebrows perform a repeated vertical bounce using D3’s transition system, which chains two 2-second movements to shift the eyebrow group down and back up. Built with D3 v7, the visualization loads the library from UNPKG and uses the `select`, `append`, and `arc` APIs to construct and animate the scene.

Jjayanth1242
92% match
Loading thumbnail…

Fork of Create a face with sad

This example shows a stylized yellow face with eyes, eyebrows, and a sad mouth drawn as SVG shapes. The eyebrows animate upward and then back down over two seconds, creating a subtle emotional expression. The code uses D3 v7 selections and transitions, importing `select` and `arc` from the D3 module. The mouth is rendered using the `arc` generator with specified inner and outer radii and angles, while the SVG canvas is set to 960 by 500 pixels.

Jjayanth1242
90% match
Loading thumbnail…

Fork of Fork of Let's make a face with D3.js!

This animated SVG face shows a yellow circle with two eyes, eyebrows, and a mouth, and the eyebrows move up and down over time. The code uses D3 v5 to manipulate the DOM, appending SVG shapes and applying a chained `transition().duration(2000).attr('transform', ...)` to animate the eyebrow group’s vertical position. It imports `select` and `arc` from D3 to select the SVG element and generate the mouth’s path with an annular arc geometry.

Nnsatyaprakash22
89% match
Loading thumbnail…

Fork of Fork of Let's make a face with D3.js!

This animated SVG face shows a yellow circle with two eyes, eyebrows, and a mouth, and the eyebrows move up and down over time. The code uses D3 v5 to manipulate the DOM, appending SVG shapes and applying a chained `transition().duration(2000).attr('transform', ...)` to animate the eyebrow group’s vertical position. It imports `select` and `arc` from D3 to select the SVG element and generate the mouth’s path with an annular arc geometry.

Nnsatyaprakash22
89% match
Loading thumbnail…

Fork of Create a face with sadness

This example builds a stylized yellow face with sad eyebrows using D3 v7 and SVG. Circles form the eyes, while rectangles serve as eyebrows that animate up and down via chained `transition` calls. A path, generated with the `arc` function, creates a mouth shape. The visualization demonstrates importing D3 functions and rendering an animated, vector-based character.

Jjayanth1242
88% match
Loading thumbnail…

Fork of Create a face with d3.js!

A yellow SVG face with eyes, animated eyebrows, and an arc-shaped mouth is rendered in the center of a 960×500 viewport. The example demonstrates how to compose primitive shapes with D3 selections and apply a chained transition to move the eyebrow group vertically over two seconds, then return it. It uses `d3.select`, `d3.arc`, and `transition.attr` on SVG elements, with D3 v7 loaded from UNPKG and a local ES6 module importing `select` and `arc`.

SSilverOwl1112
88% match
Loading thumbnail…

Fork Face

A yellow circle face with black eyes and eyebrows is drawn using D3 selections, with a curved mouth created via the `d3.arc` path generator. The eyebrows animate upward and back down using `transition.attr` over two-second intervals. The example demonstrates importing specific D3 modules like `select` and `arc`, and renders entirely as an SVG with a static yellow background and animated facial features.

MMouniesh
88% match
Loading thumbnail…

Fork of Fork of Lets make a face

A yellow face with black outlines is drawn on an SVG canvas using D3 v6. The animated eyebrows move up and down via chained `transition().duration()` calls. The face is constructed from primitive shapes: circles for the head and eyes, and a path generated with the `arc()` API for the mouth. The code imports `select` and `arc` directly from D3.

EEsteLima
88% match