Skip to main content
SimilarExport ZIP
100%

akarshana_work

✓ Published1🌍 Public
224cs049@kpriet.ac.in
Last edited Aug 7, 2025
Created on Aug 7, 2025

A yellow circle with black outlines forms a smiling face centered in the SVG canvas. Two static eyes and a curved mouth are drawn, while a pair of rectangular eyebrows animates vertically, moving downward and then returning to its original position. The piece uses D3 v5 to construct the shapes via `d3.select` and `d3.arc`, and relies on chained `transition.duration` calls to create the eyebrow motion. All elements are rendered as SVG within an HTML document.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

aravind

A yellow SVG circle with black outline serves as a face, while two blue circles form eyes and a D3 arc path creates a mouth. Two rectangular eyebrows animate upward and downward using chained `transition().duration()` calls, moving between their original positions and a raised state over two seconds each. The visualization uses D3 v7 with `select`, `arc`, and SVG shapes, rendering a simple animated character entirely through D3’s selection and transition APIs.

Aaravind1724
84% match
Loading thumbnail…

Making a smiling face

A yellow circle with black outlines forms a smiling face, featuring two eyes, curved eyebrows drawn as arc paths, and a wide, open smile created with a D3 arc generator. The entire composition is centered within an SVG using a group transform. The eyebrows animate via chained `transition().duration(2000)` calls, shifting their vertical position up and down in a continuous loop. The visualization uses D3 v5 selections and the `arc()` shape generator, rendering static SVG elements with JavaScript-driven animation.

Mmagua
82% 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
82% match
Loading thumbnail…

Fork of akarshana_work

This example uses D3.js v5 to draw a sad, crying face as an SVG. The code builds the face from primitive shapes—a circle for the head, rectangles for closed eyes and angled eyebrows, and an arc path for a downturned mouth. Tear-shaped ellipses are added beneath each eye. The animation, driven by chained `transition` calls with `duration` values, makes the tears fall downward and then snap back to their original position, repeating the cycle.

224cs049@kpriet.ac.in
82% match
Loading thumbnail…

Let's make a face with D#.js

This example draws a cartoon face using D3.js v5 with SVG shapes, rendered on a yellow circle with black stroke. The code uses `d3.select` and `d3.arc()` to construct the mouth, while static circles and rectangles form the eyes and eyebrows. A `transition().duration().attr()` chain animates the right eyebrow, moving it upward and back down. The face is centered via SVG group transforms, with dimensions derived from the viewport height and width.

Aakankshaahirwal
82% match
Loading thumbnail…

d3example1

A smiling face rendered as SVG demonstrates D3.js DOM manipulation and animation. Yellow circles, black-stroked elements, and an arc path form the face, eyes, and mouth. The eyebrows, appended as rectangles, move upward and return via chained `transition().duration(2000)` calls on a group. The code uses `select`, `arc`, and attribute setters to build the static geometry and animate the eyebrow group's `transform` attribute.

Aanandbabu-k
82% match
Loading thumbnail…

smiley face

A yellow smiley face is drawn on an SVG canvas, with a circular head, two eyes, and a curved mouth created using D3’s `arc` path generator. The animation moves the eyebrows upward and back down over a four-second sequence using `transition.attrTween`. The scene is built with D3 v5 selections and transitions within a React framework, using hardcoded dimensions and offsets to position the facial features on a 960 by 500 viewport.

KKeerthipriyaBankuru
82% match
Loading thumbnail…

Let's make a face with D3.js!

A yellow circle face with black eyes, animated eyebrows, and a smiling arc mouth is drawn in SVG using D3 v5. The example demonstrates basic shapes and transitions, with the eyebrows moving up and down in a looping animation via chained `transition` calls. Code imports `select` and `arc` from D3, uses SVG attributes like `cx`, `r`, and `path` with an `arc` generator, and positions elements relative to the SVG center. Static eye circles and a mouth path complete the composition.

GGulrez
82% match