Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Pseudo Waffle Chart

Public visualization

Viewing a saved revision (read-only)

782309d4dbf74d82b1c8aa1b39544f3c

Pseudo Waffle Chart

0 stars0🌍 Public
Hhquazza@gmail.com
Last edited Dec 9, 2024
Created on Dec 9, 2024

This pseudo waffle chart displays a grid of rounded rectangular cells, with purple cells in the lower-left portion and gray cells filling the remainder. The visualization mimics the appearance of a waffle chart without using a dedicated charting library, instead rendering directly through SVG elements defined in the HTML. The React framework structures the component, while the SVG markup handles the visual output, positioning each 30x30 pixel rectangle with explicit coordinates and fill colors to create the patterned composition.

AI-generated description

A bare minimum HTML page demonstrating use of CSS and JavaScript.

See also React Starter.