hamdi sevketbeyoglu

@hsevket·4 public vizzes

Fork of Smiley Face Part III

This example shows a smiley face rendered as a React component, with a yellow circle for the head, black outline, two eyes, and a curved mouth created using a D3 arc path generator. The code uses React 16.9 and D3 v5, specifically the `arc()` generator from the `d3` module to define the mouth’s shape. All elements are drawn in SVG within a single `<g>` transform, with coordinates computed relative to the center of the 960×500 viewport. The React app mounts to a `#root` div, and the visualization is entirely static with no interactive or data-driven behavior.

Oct 5, 2021

Loading thumbnail…

Fork of Smiley Face Part II

A smiley face rendered as a yellow SVG circle with black stroke and two eye circles is shown, scaled to fit the full browser window. Built with React and ReactDOM, the component computes dimensions and positions from `window.innerWidth` and `window.innerHeight`, centering the face via a SVG `<g>` transform. The code uses static constants for eye offset, radius, and mouth dimensions, though the mouth is not drawn, leaving an incomplete smiley.

Oct 5, 2021

Loading thumbnail…

Fork of Let's Make a Face Part I

A static yellow smiley face is drawn on an SVG canvas, with two black eye circles positioned on a larger yellow circular face. The page uses raw SVG elements—`circle`, `fill`, `stroke`, and `stroke-width`—to construct the simple facial geometry, with a black outline around the face and no mouth yet. The SVG is set to 960 by 500 pixels, and the code comments indicate the coordinates are manually calculated, such as centering the face at (480, 250) with a radius of 245. This is a minimal hand-coded example without any JavaScript libraries, serving as the first part of a two-stage face-building tutorial.

Oct 5, 2021

Loading thumbnail…

Fork of Hello HTML

This example shows a simple yellow circle with a black outline and two solid black circles positioned inside it to resemble a face. The visualization is built as a bare minimum HTML page using an inline SVG element sized at 960 by 500 pixels. It renders the shapes directly with SVG tags such as `circle`, setting explicit coordinates, radii, fill colors, and stroke properties. The code uses no JavaScript libraries or data sources, relying entirely on static SVG markup to produce the graphic.

Oct 5, 2021