juanmosovich

@juanmosovich·5 public vizzes

Fork of Fork of Smiley Face Part II

This example creates a yellow smiley face that fills the entire browser window, rendered as a responsive SVG. The face consists of a large yellow circle with a black stroke, two black eyes, and a mouth, all positioned relative to the viewport’s center. Built with React and ReactDOM, the code uses inline SVG elements and the `window.innerWidth` and `window.innerHeight` properties to calculate dimensions, ensuring the graphic scales dynamically with the display. The visualization is purely programmatic, using fixed offsets for facial features rather than external data.

Oct 12, 2022

Loading thumbnail…

Fork of Smiley Face Part II

This example shows a yellow smiley face rendered as a full-screen SVG, with eyes positioned symmetrically around the center and the face circle sized relative to the window height. It uses React and ReactDOM to create SVG elements dynamically, calculating dimensions from `window.innerWidth` and `window.innerHeight`. The face is drawn with a yellow circle, black stroke, and two eye circles, all positioned using a `<g>` transform. JavaScript variables like `eyeOffsetX` and `eyeRadius` control the layout, while the rendered SVG updates automatically when the window resizes.

Oct 12, 2022

Loading thumbnail…

Fork of cara sonriente parte 1

This example displays a simple smiley face composed of three SVG circles on a yellow background with a black outline. The HTML file directly embeds the circle elements, positioning them with explicit `cx` and `cy` attributes and setting the radius and stroke properties. Although the page includes React and ReactDOM libraries, the actual rendering relies on static SVG markup rather than dynamic React components. The JavaScript file defines a trivial "Hello JSX" heading but does not interact with the face graphic.

Oct 12, 2022

Loading thumbnail…

cara sonriente parte 1

A yellow smiley face with black outlined eyes and a wide circular outline is rendered on a 960 by 500 SVG canvas. The concentric face shape uses a large yellow circle centered at 480, 250 with a black stroke, while two smaller blank circles serve as eyes at fixed coordinates. The composition is built directly with SVG circle elements, using inline styling for fill, stroke, and stroke width, with no external JavaScript libraries or data sources involved. The drawing is static, showing only the basic geometric construction of a simplified face.

Oct 12, 2022

Loading thumbnail…

Fork of Hello HTML

This example shows a simple smiley face drawn with two dark eye circles and a large yellow circle bounded by a thick black stroke. The illustration uses no data or interactive behavior—only static SVG elements. The entire graphic is constructed directly in the `index.html` file using inline SVG markup, while a CSS rule hides page margins and scrollbars. The code relies on the SVG `<circle>` elements within an HTML page, styled with fill and stroke properties, without any JavaScript libraries or data sources.

Oct 12, 2022