Gowtham Viswanath K

@gviswa09·4 public vizzes

Smiley Face Part II

This example shows a partial smiley face rendered as static SVG shapes: a yellow circle with a black outline and two unfilled circles for eyes, leaving the mouth absent. Built with React and ReactDOM, the code defines the SVG elements declaratively inside a React component and renders them into the DOM via `ReactDOM.render`. The SVG markup uses standard `circle` elements with explicit `cx`, `cy`, and `r` attributes, and the example imports React and ReactDOM from specific library versions.

Apr 27, 2022

Loading thumbnail…

Sm

A yellow circle with a thick black outline dominates the view, while two smaller unfilled circles sit symmetrically on either side of its upper half, suggesting a simple face. The piece is a static SVG composition built directly with raw SVG elements like `circle` and geometry attributes (`cx`, `cy`, `r`, `fill`, `stroke`). Rendered as an inline SVG inside an HTML page, the visualization relies on hard-coded coordinate values rather than a data-driven framework, and the YouTube embed in the README links to context not shown in the graphic itself.

Apr 27, 2022

Loading thumbnail…

Hello HTML

This example is a minimal HTML page titled "Hello HTML." It demonstrates the basic structure of an HTML document, containing only the doctype declaration, a head section with a title, and an empty body element. The page does not include any styling, interactive elements, or data visualization. It renders a blank page to the viewer, with no visible content or behavior beyond the browser's default display. The example serves as a starting point for web development, showing the required skeleton for an HTML file without any additional libraries or APIs.

Apr 27, 2022

Loading thumbnail…

Hello HTML

This example demonstrates a minimal HTML page that embeds an SVG graphic containing a single circle. The page uses no external libraries or JavaScript; it relies solely on the native SVG element within an HTML document. The circle is rendered using the `<circle>` tag with a radius of 100, but it lacks coordinates, so it defaults to the origin. The example is a bare-bones illustration of how to integrate vector graphics directly into a web page using the SVG rendering approach.

Apr 25, 2022