Skip to main content
100%

fresh block

✓ Published0🌍 Public
Aacrithary
Last edited Mar 15, 2016
Created on Mar 15, 2016

The visualization displays three horizontal stripes stacked vertically, alternating between teal and yellow. Each stripe is a fixed rectangle rendered as SVG. The code uses D3.js version 3.5.5 to select the body, append an SVG container, and create the rectangles with explicit x, y, width, and height attributes. Fill colors are applied via inline styles, with no interaction or animation present.

AI-generated description

Built with blockbuilder.org

Similar vizzes

Loading thumbnail…

fresh block

This example shows a simple geometric composition of three stacked rectangles in alternating blue and yellow, paired with a black diagonal line that cuts across them. The visualization is created using the D3.js library, version 3.5.5, to append SVG elements to the page. Specifically, the code uses `d3.select` to add `rect` shapes with explicit pixel coordinates and fills, and `d3.svg.line()` to generate a path from three data points. The line is drawn with zero stroke width and a black fill, making it a solid triangle-like shape. The rendering relies entirely on static SVG attributes, with no data loading or interaction.

BBrandonStroud
86% match
Loading thumbnail…

fresh block

A stacked bar chart shows three horizontal rectangles in teal and gold, arranged vertically, with a black central triangle and a white polygon outline at the upper left. The chart renders fixed SVG shapes directly, using `d3.select` and `svg.append` to construct the scene. The bars, with widths of 270 pixels and heights of 50, sit at y-coordinates 200, 250, and 300, while the triangle connects points from (150,350) to (275,275) and (150,200). The visualization uses D3 v4 and plain SVG attributes, with no data file or interaction.

HHeywhoyou22
86% match
Loading thumbnail…

fresh block

Four colored blocks in red, yellow, brown, pink, blue, and green each occupy 25% of the width and sit as inline-block elements in a single row, displaying only the text “XXX” in each. The visualization uses plain HTML and CSS within an SVG-enabled page, though the D3 v4 script is commented out, so no D3 API calls are active. The rendering relies on static div styling rather than data-driven SVG or JavaScript manipulation.

Aanouar009
85% match
Loading thumbnail…

fresh block

Three green rectangles of varying heights stand in a row on a blank SVG canvas, each bar’s x-position and height mapping directly to the same numeric value from a hardcoded three-element array. The visualization uses D3 v4’s data join (`selectAll`, `data`, `enter`) to append `rect` elements, setting their `width` to a fixed 25 pixels while deriving `height` and `x` from each datum. The SVG container is created via `d3.select("body").append("svg")`, with the chart’s simplistic styling and minimal layout emphasizing the direct translation of data values into geometric properties.

HHadiem
85% match
Loading thumbnail…

fresh block

Three fixed-width green bars stand vertically on an SVG canvas, each bar's height and horizontal position determined by the values in a small inline JavaScript array. The visualization uses D3.js v3 to select the SVG container, append rectangle elements, and bind their dimensions directly to the data array values. The code applies static attributes for width, fill color, and dynamic inline functions for height and x-position, rendering a simple, non-interactive bar chart without axes or labels.

SSraavya
85% match
Loading thumbnail…

fresh block

Three fixed-width green bars stand vertically on an SVG canvas, each bar's height and horizontal position determined by the values in a small inline JavaScript array. The visualization uses D3.js v3 to select the SVG container, append rectangle elements, and bind their dimensions directly to the data array values. The code applies static attributes for width, fill color, and dynamic inline functions for height and x-position, rendering a simple, non-interactive bar chart without axes or labels.

SSraavya
85% match
Loading thumbnail…

fresh block

A single SVG chart displays two equally sized vertical rectangles, each filled with light blue and outlined in green, positioned side by side within a bordered container. The visualization demonstrates basic SVG shape creation and layout using D3 v4, where the rectangles are appended to a grouped SVG element with fixed dimensions. The code explicitly sets the width and height for the first rectangle, then positions the second rectangle at an x-offset equal to half the available width. The chart is rendered entirely through D3's selection and append methods, with no data binding or interaction.

Aaaronbalthaser
84% match
Loading thumbnail…

fresh block

This example displays a static SVG canvas containing three colored rectangles, arranged horizontally with blue, white, and red fills at varying x-coordinates. The visualization is generated using d3.select to append the SVG element with fixed dimensions, and the color data is stored in a JavaScript array with fill and position properties. Though the code defines the flag array with console.log output, the rectangles are not yet rendered to the screen. The implementation relies on D3 v4’s SVG creation APIs, with the data structure prepared for potential future rendering.

LLaurynKW
84% match