Xuban

@XubanCeccon·3 public vizzes

Fork of Smiley Face Part II

This example shows a responsive smiley face built with React, rendered as SVG, with the face scaling to fill the browser window. The code uses ReactDOM to render a set of SVG circles for the head and eyes, while the mouth is drawn using the d3.arc() generator from D3 v7, which creates a path based on specified inner/outer radii and start/end angles. The layout positions the face at the center of the viewport, with stroke widths and offsets defined as constants. The resulting visualization combines declarative React components with D3's geometry utilities for a simple, interactive-free graphic.

Jan 23, 2023

Loading thumbnail…

Fork of Let's Make a Face Part I

A yellow smiley face rendered in SVG occupies the center of a 960 by 500 canvas. The face consists of a large yellow circle with a black stroke for the head, and two smaller black circles positioned symmetrically to represent the eyes. The rendering is achieved by directly embedding static SVG `<circle>` elements in the HTML, without JavaScript or external data. This example demonstrates basic SVG shape primitives and coordinate placement, serving as a step toward constructing more complex facial features.

Jan 23, 2023

Loading thumbnail…

Fork of Hello HTML

This example shows a minimal React page that renders a smiley face using two SVG circles for eyes and a larger outlined circle for the head. The code loads React 18.2 from a CDN and logs the `React` object to the console, though it does not actually use any React components or hooks for the visualization. Instead, the static SVG is embedded directly in the HTML body. The visual output is a basic yellow face with black strokes, drawn purely through SVG markup without interaction or data binding.

Jan 22, 2023