jamlicker

@jamlicker·4 public vizzes

Fork of Let's Make a Face Part I

This is a fork of an interactive face-building example that outlines a yellow smiley face using SVG circles. It shows the initial stage of constructing a face, with two black eye circles positioned on a larger yellow circle that has a black stroke border. The example uses React and ReactDOM for the application framework, while the rendering is handled entirely through SVG elements defined directly in the HTML file, with a bundled JavaScript file providing the application logic.

Apr 16, 2021

Loading thumbnail…

Fork of Smiley Face Part II

This example shows a full-screen smiley face rendered as a yellow circle with two black eyes, dynamically sized and positioned relative to the browser window. It uses React 16.9 and ReactDOM to declaratively construct an SVG, with dimensions and coordinates derived from `window.innerWidth` and `window.innerHeight`. The face’s components—head, eyes, and mouth—are defined as SVG elements, where the head is centered using a `<g>` transform and the eyes are offset via `cx` and `cy` props with fixed pixel values.

Apr 16, 2021

Loading thumbnail…

Fork of Smiley face

This example shows a simple smiley face rendered as a fixed SVG graphic. It uses plain HTML and CSS to set up a full-viewport page with no margins, while the face itself is drawn with three `<circle>` elements inside an inline `<svg>`. The main face is a yellow circle with a black stroke, and two smaller black circles form the eyes. No JavaScript or external libraries are used; the entire visualization is static markup.

Apr 13, 2021

Loading thumbnail…

Smiley face

This example draws a simple smiley face using only SVG primitives in a React-free HTML page, though the listing notes React as a possible framework for the v3 source. The face consists of three circles: a large yellow head with a black outline and two smaller black circles for eyes, all positioned within an SVG canvas. The code relies on standard SVG elements like `<circle>` and CSS styles for the page layout, with no data binding or interactivity. It demonstrates basic declarative vector graphics rendering in the browser.

Apr 13, 2021