JIAQI LIU

@JIAQI13·2 public vizzes

Fork of Smiley Face Part II

This example renders a responsive smiley face using React and SVG, with the face centered and scaled to fill the browser window. The code uses React’s `createElement` and `ReactDOM.render` to draw the yellow circle head, two eye circles, and a mouth, all positioned via a `<g>` transform. It calculates dimensions from `window.innerWidth` and `window.innerHeight`, while hardcoding offsets and radii for the facial features. The implementation relies on React 16.9 and standard SVG primitives.

May 7, 2021

Loading thumbnail…

Fork of Let's Make a Face Part I

This example shows a simple yellow smiley face built with SVG shapes: a large outlined circle for the head, a smaller circle for an eye, and a tiny circle as a detail. The face is centered in a 960-by-500 viewport using fixed coordinates. The code directly uses SVG elements like `circle` with attributes for position, radius, and stroke, and relies on inline CSS to hide page overflow. It is a static, hand-coded composition with no JavaScript libraries or data binding.

May 7, 2021