janek206

@janek206·3 public vizzes

Hello HTML

This example shows a simple yellow face rendered as an SVG graphic, composed of three circles: a large head and two eyes. The visualization demonstrates a minimal React setup using `ReactDOM.render` to inject the graphic into the page’s root element. The code defines coordinates and dimensions as JavaScript constants, then uses React’s JSX syntax to create the SVG elements. The styling is handled through a CSS rule that removes the body margin, and the app loads React and ReactDOM from the Unpkg CDN.

Aug 15, 2022

Loading thumbnail…

Fork of Smiley Face Part II

A full-window smiley face renders with React and SVG, scaling to the browser viewport. The face consists of a yellow circular head, two black eyes, and an implied mouth, all positioned relative to the viewport center. React 16.9 creates the SVG elements, while constants like `eyeOffsetX`, `eyeRadius`, and `mouthRadius` define the facial geometry. The code uses JSX within the `App` component and `ReactDOM.render` to mount the visualization to the page.

Aug 15, 2022

Loading thumbnail…

Fork of Let's Make a Face Part I

This example shows a minimalist yellow smiley face constructed from three SVG circles on a 960 by 500 canvas. The main face is a large yellow circle with a black stroke, positioned at the center, while two smaller black circles serve as eyes. The code uses raw SVG elements within an HTML document, with static coordinates for the circles and basic styling through inline attributes. The rendering is a simple, static vector illustration without animation or interactivity.

Aug 13, 2022