Tang Ye

@trakrider·2 public vizzes

Let's Make a Face Part I

A static SVG face diagram shows a yellow circle with two smaller black circles as eyes, stopping short of a complete smile. The drawing is hardcoded in the `index.html` file using inline SVG elements with explicit `cx` and `cy` coordinates. The page imports React 17 via a UMD script, but `index.js` only logs the React object to the console, so no interactive or dynamic behavior is present. The rendering is purely declarative SVG markup, with the circle positions computed manually rather than through any layout or drawing library.

Oct 21, 2020

Loading thumbnail…

Smiley Face Part II

A smiling face is drawn as a full-screen SVG, with a yellow circular head, two black eyes, and a black stroke outline, all positioned relative to the window dimensions. The React component `App` uses JSX to render the SVG elements, translating the coordinate system to the center of the viewport to place the circles. It employs React 16.9 via the UMD builds and `ReactDOM.render` to mount the visualization, with constant values for eye offsets, radius, and mouth width defining the facial features.

Oct 21, 2020