rohitchavan007

@rohitchavan007·4 public vizzes

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

This example demonstrates fundamental DOM manipulation with D3.js by constructing a smiley face from SVG primitives—a yellow circle, two eyes, eyebrows, and a mouth—and animating the eyebrows through a two-stage transition. The code uses D3 v5’s `select`, `append`, and `attr` methods to build the SVG structure, while the `transition().duration(2000)` API moves the eyebrow group vertically in a looping sequence. The mouth is drawn with the `arc` shape generator, and static layout parameters such as `eyeSpacing` and `eyebrowYOffset` control facial proportions.

Oct 9, 2023

Loading thumbnail…

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

This visualization builds a smiling face from basic SVG shapes using D3.js v5. The code appends a yellow circle for the face, two eyes, and a mouth path generated with the `d3.arc` function, all centered via a group transformation. It demonstrates animated DOM manipulation by applying a looping `transition` with a 2-second duration to the eyebrows group, moving it up and down. The example uses `d3.select`, `d3.append`, and attribute setters like `.attr` to construct the scene, with styles handled in an external stylesheet.

Oct 9, 2023

Loading thumbnail…

abex.js!

A smiling face built from SVG shapes animates its eyebrows in a looping motion. The example uses D3.js v7 to construct the face, positioning circles for eyes and a path for the mouth, with rectangular eyebrows that move via `transition` calls. The code demonstrates D3's selection, arc generation, and chained transition API for animation.

Oct 9, 2023

Loading thumbnail…

Fork of Create a face with d3.js!

A cartoon face built with SVG circles, rectangles, and an arc path animates its eyebrows up and down. The example loads D3 v7 from UNPKG and demonstrates modular imports of `select` and `arc` from the D3 library. Eyebrows transition vertically using chained `transition().duration()` calls, while the face is centered via SVG group transforms on a 960×500 canvas.

Oct 9, 2023