Najmuddin

@npatwa·2 public vizzes

SVG Fundamentals

This example demonstrates the foundational SVG circle element, showing how to define basic vector graphics for web pages. The code creates a single red circle with explicit attributes for center coordinates (`cx`, `cy`) and radius (`r`). The circle is drawn directly inside an inline `<svg>` element within the HTML body, using the browser’s native SVG rendering. No external JavaScript libraries are used; the example relies purely on static markup with hardcoded pixel values (960 by 500 viewport, circle at 250,250 with a 50-pixel radius).

Dec 22, 2023

Loading thumbnail…

Smiley Face Part I

This example displays a simple smiley face, constructed from a large yellow circle for the face and two smaller black circles for the eyes. Rendered as a static SVG, the code defines the shapes directly using SVG `circle` elements within an `index.html` file. The face circle is centered on the canvas with a black stroke, while the eye circles are positioned symmetrically to either side. The visualization demonstrates basic SVG markup for creating geometric shapes, with no interactive or animated behavior present.

May 9, 2023