Anyi Horizontal Bar Plot

100%

Anyi Horizontal Bar Plot

✓ Published0🌍 Public

Last edited May 13, 2022

Created on May 13, 2022

This example shows simple horizontal bars for categories A through D, with bar lengths decreasing from A to D against a plain white background. The SVG is hand-authored in HTML using `<rect>` and `<text>` elements, with black bars and labels positioned at fixed coordinates. The page uses the Share Tech font from Google Fonts and sets a large 50px text size via CSS. No JavaScript or data-binding library is used.

AI-generated description

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

Similar vizzes

Loading thumbnail…

Anyi Psudo Bar Plot

This example presents a pseudo bar plot using four black rectangles of varying heights positioned on a white background. The SVG markup defines each bar with explicit x, y, width, and height attributes, creating a simple categorical comparison. The visualization is rendered directly in an HTML document using inline SVG, with the React framework imported but not utilized in the displayed code. The bars are styled with a solid dark fill, and the viewBox is set to 960 by 500 pixels.

Iigndukwe

86% match

Loading thumbnail…

Pseudo Horizontal Bar Chart

This example approximates a horizontal bar chart using raw SVG rectangles and text elements, displaying categories A through D with varying bar widths. The chart uses a black-on-white design with large ‘Share Tech’ typography, emphasizing a minimalist aesthetic. Built with inline SVG markup and standard HTML/CSS, it relies on fixed pixel coordinates for bar placement and sizing rather than data-driven JavaScript or a charting library. The rendering is fully static, with no interactive or animated behaviors present in the code.

Ttriciascully

81% match

Loading thumbnail…

Pseudo Horizontal Bar Chart

This visualization uses black rectangles of varying widths to create a pseudo horizontal bar chart for categories A through D. The SVG markup defines the bar dimensions and positions, while text elements label each bar with its corresponding letter. The chart employs a minimal design with white background and the Share Tech font, rendering all elements directly via inline SVG without additional JavaScript libraries or data loading mechanisms.

Llili463e

81% match

Loading thumbnail…

Pseudo Horizontal Bar Plot

Four labeled bars approximate a horizontal bar plot using SVG rectangles. The first bar is red with a black outline, while the remaining three bars are dark gray. Two texts mark categorical labels A through D on the left axis. The HTML file defines a 960 by 500 pixel SVG canvas, using the Share Tech font at 72 pixels to display labels. The layout uses fixed coordinates to position each bar, but no interactive elements or data bindings are present.

Rroyable88

80% match

Loading thumbnail…

Pseudo Horizontal Bar Chart

This pseudo horizontal bar chart displays categorical data for values A through D, with bars extending from a common left baseline. The SVG rendering uses basic rectangular shapes with black fills to represent the bar lengths, which decrease progressively from A to D. A separate text element using the Inconsolata font displays the category labels. The chart uses plain SVG attributes for positioning and sizing rather than a JavaScript visualization library, reflecting its creation as a Figma export.

AAllison Leggett

79% match

Loading thumbnail…

Horizantal Bar SVG Fundamentals

This example shows a horizontal bar chart with four bars representing categorical values A, B, C, and D, rendered as simple SVG rectangles on a white canvas. The bars are positioned using explicit x and y coordinates with fixed heights and widths, while category labels are placed to the left using SVG text elements with a shared CSS ID for styling. The visualization is built using raw SVG markup embedded directly in an HTML page, with no external libraries or JavaScript logic, demonstrating fundamental SVG layout techniques in a React-independent context.

Ssubratanp

79% match

Loading thumbnail…

Pseudo horizontal bar chart

This pseudo horizontal bar chart is a static SVG composition built directly in HTML. Four labeled bars (A, B, C, D) extend from a common left margin, each with a fixed height and varying widths to represent distinct magnitudes. The visualization relies on raw SVG `<rect>` and `<text>` elements styled with CSS, including a custom Share Tech font. A hover effect is applied to a small circle, changing its fill and stroke color via a CSS transition, though the chart itself is non-interactive.

NNico-Nico

79% match

Loading thumbnail…

vs_bar_chart

This chart shows a minimalist horizontal bar chart comparing values for categories A, B, C, and D, with the first bar highlighted in blue and outlined in black. The chart is rendered as an SVG using specific rectangular coordinates for each bar and text elements for the labels. The code sets the bar widths directly, appears to use the Share Tech font loaded from Google Fonts, and relies on raw SVG elements rather than a charting library.

Yyesyesnono01@yahoo.com

79% match