Pseudo for horizontal bar chart

100%

Pseudo for horizontal bar chart

✓ Published0🌍 Public

Last edited May 17, 2022

Created on May 17, 2022

Six horizontal bars form a small pseudo bar chart, with categories A through F listed along the left edge. Each bar is a simple SVG `rect` with a fixed height, and the bar lengths increase progressively from the top to the bottom of the chart. The SVG `text` elements label the categories, while the chart itself uses no external libraries, relying solely on hand-coded SVG markup within an HTML document. The bars are drawn in black on a white background, with the overall layout fixed by explicit pixel coordinates.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Pseudo Horizontal Bar

Four horizontal black bars on a white background approximate a bar chart, with category labels A through D positioned to the left. The bars vary in length, though the chart does not include axes, data values, or a scale to interpret the magnitudes. Rendered as static SVG shapes, the visualization uses only `<rect>` elements for the bars and `<text>` elements for labels, all defined directly in the HTML markup without JavaScript libraries. The pseudo-bars are intentionally simple, suggesting a minimal or stylistic take on standard bar chart encodings.

Aalexscott-untitled

89% match

Loading thumbnail…

Pseudo Bar Chart

This pseudo bar chart displays six vertical bars of varying heights across a dark background, suggesting categorical data without axes or labels. Each bar is a simple SVG `<rect>` element positioned manually, with heights that imply quantitative differences between groups. The chart uses no JavaScript libraries or data binding; instead, it relies on hardcoded SVG coordinates and dimensions, with a fixed viewport of 802 by 368 pixels. The bars are rendered directly in the HTML, created in Figma and exported as static SVG markup.

AAllison Leggett

89% match

Loading thumbnail…

Pseudo Horizontal Bar Chart

A pseudo horizontal bar chart uses black rectangles to represent four labeled categories, A through D, on a white SVG canvas. The first bar is styled green with a black stroke via a CSS class, overriding its inline red fill to demonstrate CSS precedence. The visualization is built with static SVG elements, including `<rect>` and `<text>`, and uses the Share Tech font.

PPrince Kumar

88% match

Loading thumbnail…

Pseudo Horizontal Bar Chart

A pseudo horizontal bar chart displays five labeled bars (A through E) as black rectangles against a white background, with each bar's length varying by category. The SVG markup creates the bars using fixed path coordinates, while labels are positioned along the left axis via text elements. The visualization uses a clipped rectangular container and a 'Share Tech' font from Google Fonts. This example relies purely on inline SVG paths and text elements, demonstrating a static, non-interactive chart built directly with raw SVG code.

KKhanAzmat

88% match

Loading thumbnail…

Pseudo Horizontal Bar Chart

A pseudo horizontal bar chart displays four black bars of varying lengths on a white background, with a single letter "A" positioned to the left. The chart uses nested SVG elements, with the outer and inner SVG both set to 960 by 500 viewBoxes. Rectangles are drawn with the `rect` element and filled with `#111111`, while the label uses the `text` element. The rendering is achieved through inline SVG markup, without any JavaScript libraries or external data sources.

SSeanmgard

88% match

Loading thumbnail…

Pseudo bar chart

This SVG-based pseudo bar chart approximates a standard bar chart without using any charting library, instead relying on hand-coded SVG `<rect>` elements. It displays four vertical bars of varying heights and equal widths, positioned along the x-axis with distinct y-coordinates and heights to suggest categorical data. The code uses plain SVG markup within an HTML file, with a fixed viewport of 960 by 500 pixels and no axes, labels, or gridlines, prioritizing visual similarity over statistical accuracy. The rendering approach is direct and minimal, with each rectangle explicitly defined via its `x`, `y`, `width`, and `height` attributes.

NNikki Masroor

87% 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

87% match

Loading thumbnail…

Pseudo Bar Chart Horiz

A pseudo bar chart displays seven labeled categories (A–G) with rounded bars of varying lengths, where category C is highlighted in pink while the rest are black. The chart uses rotated rectangles drawn directly in SVG, with each bar positioned and rotated via the `transform` attribute. Labels are rendered as SVG text elements, using a Roboto font loaded from Google Fonts. The arbitrary bar heights appear hand-coded rather than derived from a data file, and the minimal styling is applied through CSS classes within the embedded stylesheet.

Hhelloelectro

87% match