Robert Nakano

@bobbyinfj·3 public vizzes

Fork of Smiley Face Part II

A smiling face fills the browser window, rendered as a yellow circle with black outline, two black eyes, and no mouth, centered dynamically using the window dimensions. The React application uses ReactDOM to mount an SVG element, with window.innerWidth and innerHeight defining the canvas size. Circles are positioned via SVG attributes, including cx, cy, r, and stroke-width, with a group transform translating coordinates to the screen center.

Apr 18, 2021

Loading thumbnail…

Fork of Let's Make a Face Part II

This example shows a simple smiley face built from three SVG circles: a large yellow head with a black outline and two smaller circles for eyes. The face is centered in a 960-by-500 viewport, with the head positioned at coordinates (480, 250) and a radius of 245. The code uses raw SVG markup inside an HTML document, specifying circle elements with attributes for center coordinates, radius, fill color, and stroke properties. The page itself has no interactive behavior or animation, only static rendering of the geometric shapes.

Apr 18, 2021

Loading thumbnail…

Fork of Hello HTML

This example displays a static SVG scene: a yellow circle with a thick black outline, accompanied by two smaller unfilled circles positioned as eyes, all below a plain “Hello World!” heading. The page uses raw HTML and inline CSS to remove body margins and hide overflow. Rendering relies entirely on the SVG markup embedded directly in the document, with no JavaScript libraries or external data sources. The circles are drawn using basic `<circle>` elements with explicit `cx`, `cy`, `r`, `fill`, and `stroke` attributes, demonstrating a minimal hand-coded data-less visualization.

Apr 18, 2021