Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Fork of Let's Make a Face Part I

Public visualization

Fork of Let's Make a Face Part I

0 stars0🌍 Public
Wweny1109
Last edited Jul 22, 2023
Created on Jul 22, 2023

This example shows a yellow smiley face rendered as an SVG circle with two smaller circles for eyes, positioned symmetrically around the center of a 960×500 canvas. The face is drawn using React and ReactDOM, with the main circle's radius and eye offsets defined as variables derived from the canvas dimensions. The code uses inline SVG elements within a React component, computed from constants like `centerX`, `centerY`, `strokWidth`, `eyeOfsetX`, and `eyeOfsetY` to maintain consistent spacing. The rendering relies on React 16.9 and ReactDOM’s `render` method to mount the component into the DOM.

AI-generated description

Half way towards a smiley face.

Comments

Sign in to join the discussion.

MIT Licensed