Gaeun Karen Lee

@kroodl21·2 public vizzes

Fork of Smiley Face Part2

This example shows a smiley face constructed entirely from SVG circles, with the face, two eyes, and a head all rendered as circular shapes. The code uses React to define the drawing as a component, with ReactDOM rendering it to the page. The SVG canvas is 960 by 500 pixels, and the face is centered with a thick black stroke and yellow fill, while the eyes are positioned using calculated offsets from the center. The drawing uses React 17 and React DOM, with all geometry defined through JavaScript variables and inline SVG attributes.

Jul 31, 2021

Loading thumbnail…

Smiley Face Part1

This example shows a simple smiley face built from three SVG circles: a large yellow head with a black outline and two smaller black eyes. The face is statically positioned at the center of a 960 by 500 pixel canvas. The visualization is created manually using raw SVG elements—`<circle>` tags—plus inline CSS to remove page margins and hide overflow. No JavaScript libraries or data sources are involved; the rendering relies entirely on the browser’s native SVG support.

Jul 31, 2021