Skip to main content
SimilarExport ZIP
100%

Face - Shashidhar Kalapatapu - 11545863

✓ Published0🌍 Public
SShashi42
Last edited Feb 25, 2023
Created on Feb 25, 2023

A stylized human face rendered as an SVG drawing using D3.js. The face features a circular head, eyes with pupils, eyebrows, a mouth with teeth lines, ears, hair as a polygon, and a nose as a polyline. Eyebrows animate vertically over four seconds using chained `transition().duration()`. The visualization is built with D3's `select`, `arc`, and SVG shape methods, using hardcoded coordinates for each facial element.

AI-generated description

ICE-4 Make a face using D3.js on Vizhub | By: Shashidhar Kalapatapu - 11545863

MIT Licensed

Similar vizzes

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

Face

This gallery example displays a stylized, cartoon-like face composed of SVG shapes, built with React and D3.js v7. The face features a large grey circular head with a blue stroke, red and purple eyes with green irises, a yellow elliptical nose, and black line-based eyebrows, eyelashes, and mouth. The D3 `arc` API constructs the mouth as a semi-circular path, while the rendering primarily relies on React to define and position the SVG elements, with the d3.js library used specifically for that mouth arc.

SShivaKarpe
81% match
Loading thumbnail…

D3 Face

A stylized face is drawn using SVG shapes: a yellow circle for the head, two circles for eyes, rectangles for eyebrows, and a path for a mouth. The face is centered and built with D3’s `select` and `append` methods. Eyebrows animate via chained `transition().duration(2000)` calls, shifting their position twice. The mouth is created with `d3.arc()` using specified inner and outer radii and angles, demonstrating a simple, declarative approach to constructing and animating geometric compositions in a React context.

Ssheafallick
80% match
Loading thumbnail…

Face with D3.js!

A smiling face drawn with SVG shapes animates its eyebrows and mouth in a looping transition. The code builds the face using D3.js v5 selection and append methods to create circles, rectangles, lines, and an arc-based path, all positioned with hardcoded coordinates. The eyebrows shift upward and the mouth changes thickness through chained `transition().duration(3000)` calls, demonstrating basic DOM manipulation and attribute updating without data binding.

Nnikeshkv
80% 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
80% match
Loading thumbnail…

Face

A smiling face drawn with orange SVG circles and arcs animates its eyebrows and mouth. The code uses D3 v5’s `select`, `arc`, and chained `transition` calls to raise and lower rectangular eyebrows and to expand and contract the mouth’s outer radius over two-second intervals. Static features include circular eyes and a fixed head outline, all centered within a 960 by 500 SVG canvas.

Aabcz1234
80% match
Loading thumbnail…

SVG Face

A stylized, yellow SVG face with black-outlined features and animated eyebrows. The face is constructed using D3 primitives: circles for the face and eyes, and rectangles for the brows. The entire face is centered within the SVG, with the mouth drawn as an arc path. The eyebrows animate via chained `transition` calls, moving downward over one second and then returning to their original position over two seconds. The code imports `select` and `arc` from D3 v5.

Aatree-rohit
80% match
Loading thumbnail…

Face

A smiling face built entirely from SVG primitives is drawn in the center of a light-blue circular head. The code uses D3 v7 to append a face group, two elliptical eyes, rectangular eyebrows, and a red arc for the mouth, with all positions computed relative to the viewport dimensions. The example demonstrates D3’s selection and arc APIs for constructing a simple, scalable vector graphic without any external data.

Nnagasai.mandalapu@gmail.com
80% match