Skip to main content
SimilarExport ZIP
100%

Puedo Charts 2

✓ Published1🌍 Public
Kkhaledakanan@gmail.com
Last edited May 29, 2024
Created on May 29, 2024
Forked from Puedo Charts 1

Nine vertical black bars of equal width stand on a white background, each with a different height, forming a simple pseudo bar chart. The static SVG visualization directly encodes data through the rectangles’ varying y-coordinates and heights. Rendered as raw SVG elements within an HTML file, the chart uses absolute pixel positions and explicit `height` and `y` attributes, with no interaction or animation, to display nine discrete values.

AI-generated description

Psuedo Bar Charts

<iframe width="560" height="315" src="https://www.youtube.com/watch?v=xkBheRZTkaw" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
MIT Licensed

Similar vizzes

Loading thumbnail…

Pseudo Bar Chart

This example shows six vertical bars of varying heights arranged from left to right, approximating a simple bar chart without any axes, labels, or gridlines. The chart is drawn directly using Scalable Vector Graphics (SVG) primitive shapes—specifically, a series of `<rect>` elements—rendered on a white canvas within a 960-by-500-pixel viewport. Each rectangle is filled solid black, with its `x`, `y`, `width`, and `height` attributes hard-coded in the HTML markup. The visualization relies entirely on raw SVG code, with no JavaScript libraries or data transformation, and includes a full-size background rectangle to set the chart area.

Cchacon1@uic.edu
80% match
Loading thumbnail…

Pseudo horizontal bar chart

Four dark rectangular bars on a white background create a pseudo horizontal bar chart, with each bar spanning a different width and height to suggest varying categorical values. The chart uses raw SVG shapes—`rect` and `path` elements—rather than a charting library, and the rendering relies on inline SVG attributes for coordinates and dimensions. The visualization demonstrates a minimalist, static approach to bar chart composition without interactive behavior or data binding.

WWasanta Pruttisarikorn
80% match
Loading thumbnail…

Puedo Charts 1

This example demonstrates the use of raw SVG elements to construct a simple scatterplot-like composition. It displays thirteen black circles of varying positions across a 960-by-720 canvas on a white background, suggesting a rudimentary visualization of data points without axes or labels. The rendering is built entirely with basic SVG primitives, using `circle` and `rect` elements defined directly in the HTML. There are no external libraries or JavaScript APIs; the graphic is static, relying solely on the SVG `xmlns` namespace and inline styling to define the visual output.

Kkhaledakanan@gmail.com
79% match
Loading thumbnail…

Pseudo Horizontal Bar

This example shows four black vertical bars of descending height arranged from left to right across a white canvas, creating a pseudo horizontal bar chart. Each bar uses an SVG `rect` element, with explicit `x`, `y`, `width`, and `height` attributes hard-coded into the markup. The rendering uses static SVG (no animation or interaction) within a simple HTML page, and the overall effect relies on the viewer’s perception of the bars as part of a single horizontal sequence. The chart is purely presentational, with no axis, labels, or data-binding logic.

RRubanda
79% match
Loading thumbnail…

Pseudo Charts 3

This example presents a set of seven horizontal bars drawn as plain black rectangles, each labeled with a letter from A to G on the left. The chart demonstrates fundamental SVG shapes and styling, with hover effects that slowly transition the fill and stroke of both rectangles and text. The code uses raw SVG elements like `rect` and `text` within an inline `<svg>` tag, alongside CSS transitions triggered by the `:hover` pseudo-class. No external charting library is employed, only the browser’s native vector rendering capabilities.

Kkhaledakanan@gmail.com
79% match
Loading thumbnail…

Pseudo Bar Chart

A pseudo bar chart presents five vertical bars of varying heights as solid black rectangles against a white background, suggesting categorical data through minimal visual encoding. Built with raw SVG elements, the chart uses five `<rect>` shapes positioned at increasing x-coordinates, with heights ranging from 400 to 150 pixels to imply descending values. The code renders directly in the browser without any JavaScript libraries, relying solely on static SVG markup within an HTML document. This example demonstrates a hand-crafted, design-focused approach to bar chart construction, prioritizing visual clarity over data-driven generation.

Ttverdone
79% match
Loading thumbnail…

Pseudo Charts 4

A single thick black line drawn with an SVG path creates a pseudo bar chart across a white 960 by 720 canvas. The line bends and wiggles vertically, suggesting abstract data values without using traditional bars. The chart uses raw SVG elements, including a path with rounded stroke caps, a drop-shadow filter, and hover effects that thicken the stroke. Text is absent, and the visualization relies entirely on the organic, hand-drawn-like line structure.

Kkhaledakanan@gmail.com
79% match
Loading thumbnail…

Pseudo Bar Chart

This pseudo bar chart uses SVG rectangles and paths to render a set of abstract, hand-drawn-style bars on a plain white background. The chart shows five vertical bars of varying heights and widths, arranged across the canvas with dark gray fills against a light gray backdrop. The code directly constructs each bar using static SVG elements, such as `<rect>` and `<path>`, rather than relying on a JavaScript library or data binding. With no scales, axes, or data-driven logic, this example serves as a minimal, visual approximation of a conventional bar chart.

WWannabeProgrammerr
79% match