ellie.ackerson26@gmail.com

@ellieackerson·4 public vizzes

Pseudo Bar Chart

A pseudo bar chart uses hand-drawn SVG shapes to approximate a classic bar chart layout. Five teal rectangles and paths of varying heights and positions suggest categorical data values against a white background. Built with plain SVG in a single HTML file, the example demonstrates fundamental SVG elements like `rect` and `path` to craft a minimalist, abstract visualization. No JavaScript libraries or data sources are used; the rendering relies solely on static SVG markup.

Dec 21, 2025

Loading thumbnail…

Pseudo Scatter Plot

This example uses raw SVG to place a set of black ellipses on a white canvas, which together approximate a scatter plot. Nine data points are positioned by their absolute coordinates in a 960-by-500 viewBox, each with a fixed radius of 41 on both axes. The HTML file contains no JavaScript or charting libraries; it simply defines an SVG scene with a background rectangle and nine ellipse elements. This demonstrates the fundamental SVG shapes and coordinate system that a library like D3 would otherwise generate dynamically to encode data.

Dec 21, 2025

Loading thumbnail…

SVG Fundamentals

This example demonstrates basic SVG shapes using native SVG elements within an HTML document. It renders three circles with different radii and colors (white, purple, and cyan) alongside a single path that combines circular arcs and quadratic curves to form a leaf-like shape with a magenta fill and hot pink stroke. The drawing relies on SVG’s XML-based markup, including the `viewBox` attribute for coordinate scaling and inline attributes for shape geometry. The code includes an `index.js` file that merely logs “hello world” and a `styles.css` referencing a `.message` class not applied to any elements.

Dec 21, 2025

Loading thumbnail…

Fork of SVG Fundamentals

A fork of an SVG fundamentals demo, this example displays a single decorative path shape filled with magenta and outlined in hot pink. The code uses raw SVG elements—including `circle`, `path`, `fill`, and `stroke` attributes—within an inline `<svg>` tag, alongside a `viewBox` for coordinate scaling. It also includes minimal supporting files: a JavaScript file that logs "hello world" to the console, and a CSS rule styling a message class with a large font size. The visualization is purely illustrative, demonstrating basic vector graphics construction without any data binding.

Dec 21, 2025