Bhabesh

@mim2700·3 public vizzes

Fork of Smiley Face Part II

This example renders a yellow smiley face that fills the browser window using React and D3 v6. The face is drawn with SVG circles for the head and eyes, while the mouth is created using the `d3.arc()` API to generate a curved path. Dimensions are calculated from `window.innerWidth` and `window.innerHeight`, centering the face and scaling its radius relative to the viewport height. React handles the SVG element structure, while D3 provides the arc generator for the mouth shape.

Mar 10, 2021

Loading thumbnail…

Fork of Let's Make a Face Part I

A yellow circle with a black outline forms the face, centered within an SVG canvas. Two smaller, unfilled circles represent the eyes, positioned symmetrically to the left and right of the face's center and above its vertical midpoint. The code uses React and ReactDOM to render the SVG elements, with dimensions and positions defined by JavaScript variables for width, height, center coordinates, stroke width, eye offset, and eye radius. The rendering approach is purely SVG, with no external data source.

Mar 7, 2021

Loading thumbnail…

Smiley Face Part I

A single static SVG chart depicts a yellow circle with a black outline, centered on a 960 by 500 canvas, alongside two smaller empty circles positioned as eyes. The main circle uses a fixed radius and stroke width, while the eye coordinates are manually set via cx and cy attributes in the markup. No dynamic data or interaction is present; the example relies purely on hard-coded SVG primitives to illustrate the initial step toward a smiley face composition.

Feb 28, 2021