Skip to main content
SimilarExport ZIP
100%

Fork of akarshana_work

✓ Published0🌍 Public
224cs049@kpriet.ac.in
Last edited Aug 7, 2025
Created on Aug 7, 2025
Forked from 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.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of crying face

This example renders a cartoon crying face entirely with SVG shapes, including a yellow head, eyes, eyebrows, and a frowning mouth. The animation makes the eyebrows move downward and back upward in a repeating cycle using D3’s `transition` API, creating a distressed or crying expression. The code uses `d3.select` to access the SVG, `d3.arc` to draw the mouth as a curved path, and leverages the React framework for structure. The face is built from basic geometric elements, with the tears represented as small blue circles.

PPatilShruti20
86% match
Loading thumbnail…

Fork of crying face

This example renders a cartoon crying face entirely with SVG shapes, including a yellow head, eyes, eyebrows, and a frowning mouth. The animation makes the eyebrows move downward and back upward in a repeating cycle using D3’s `transition` API, creating a distressed or crying expression. The code uses `d3.select` to access the SVG, `d3.arc` to draw the mouth as a curved path, and leverages the React framework for structure. The face is built from basic geometric elements, with the tears represented as small blue circles.

PPatilShruti20
86% match
Loading thumbnail…

Fork of Create a face with d3.js!

This example displays a yellow, cartoon-style face with a crying expression: large circular eyes, rectangular eyebrows, and an arc-shaped mouth drawn on an SVG canvas. Built with D3 v7, it uses `select` and `arc` to construct the facial features, while a chained `transition` animation repeatedly raises and lowers the eyebrows to simulate crying. The face is centered using an SVG group transform, and the code demonstrates local ES6 module imports alongside loading D3 via UNPKG.

AAkash Santosh Kuskar
85% match
Loading thumbnail…

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

This example shows a crying emoji face with animated eyebrows, wide eyes, a sad mouth, and tear droplets, positioned beside a simple stick-figure person on a blank canvas. D3.js constructs the SVG elements, using `select` to target the `<svg>` and `append` to build the face components with specific attributes. The eyebrows move up and down through a chained `transition` with a 2000-millisecond duration, while `arc()` generates the mouth path. Static tear circles are placed below the eyes to convey the crying emotion.

Sskmriyaz0786@gmail.com
85% match
Loading thumbnail…

Fork of D3-1: Making a face

This example uses D3.js v7 to draw a simple sad face as an SVG graphic. It renders a yellow circle for the face, two blue circles for the eyes, a black quadratic curve for the mouth, and two smaller blue dots for tears, all positioned relative to the SVG’s width and height. The code uses `d3.select` to target the SVG element and chain `.append`, `.attr`, and method calls to construct the shapes. No external data is loaded; all geometric values are computed from the hardcoded dimensions.

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

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

A smiley face built with SVG animates its eyebrows in a looping motion. The example demonstrates fundamental D3.js DOM manipulation by appending circles for the eyes, rectangles for the eyebrows, and a path generated with the `d3.arc` function for the mouth. The eyebrows move via chained `transition` calls that repeatedly offset their vertical position. The code imports `select` and `arc` from the D3 v5 library and renders entirely in an SVG container.

AAkash Santosh Kuskar
82% match
Loading thumbnail…

akarshana_work

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.

224cs049@kpriet.ac.in
82% match