fresh block

100%

✓ Published0🌍 Public

Last edited Jan 25, 2018

Created on Jan 25, 2018

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.

AI-generated description

Built with blockbuilder.org

mit Licensed

Similar vizzes

Loading thumbnail…

fresh block

A simple bar chart displays seven static blue rectangles on an SVG canvas, with each bar’s height proportional to a value in a hardcoded JavaScript array. The bars are positioned horizontally using a fixed width of 50 pixels per bar and aligned to a baseline of 300 pixels from the top. The visualization uses D3 v4’s selection and data-join methods (`selectAll`, `data`, `enter`, `append`) to create the rectangles, setting their `x`, `y`, `width`, `height`, `fill`, and `stroke` attributes directly. No axes, labels, or interactions are included; the chart just shows the raw data values as basic shapes.

MMasonLyons

88% match

Loading thumbnail…

fresh block

A set of five blue rectangles forms a simple bar chart, with each bar’s height directly proportional to values from an inline array. The code uses D3 v4’s selection and data-binding methods (`selectAll`, `data`, `attr`) to map each data point to an SVG `rect`, positioning bars side‑by‑side along the x‑axis and scaling their y‑positions and heights from a fixed baseline. The bars are evenly spaced using a constant `rectWidth`, while the SVG’s total height is fixed at 300 pixels. The chart is rendered entirely with SVG elements and hardcoded data, without scales or axes.

DDanielAguirre

88% match

Loading thumbnail…

fresh block

A set of vertical bars represents five data values, with one bar highlighted in red and the rest in blue, showing a clear visual contrast for the largest value. The chart uses D3 v4 to bind an array of numbers to SVG rectangles, scaling bar heights linearly from a maximum domain of 2500 down to zero. The code applies the scale to position each rectangle’s top and height, while a fixed bar width and white stroke separate the bars for readability.

44xDMG

88% match

Loading thumbnail…

fresh block

A simple bar chart displays five hardcoded values—10, 30, 15, 20, and 100—as vertical rectangles. The chart uses D3 v4’s selection and `append` API to create SVGs directly: `d3.select("body").append("svg")` builds the canvas, then `.selectAll("rect").data(data).enter()` generates bars whose height, y-position, and opacity are derived from each data value. Text labels repeat the same numbers below each bar using `d3.selectAll("text")`, with fixed styling for font size and monospace family. All geometry and styling are set via SVG attributes and styles, with no axes or gridlines present.

GGregory-Howard

88% match

Loading thumbnail…

fresh block

Five vertical bars form a simple bar chart, with a single red bar highlighted among blue ones. The chart encodes an array of five numeric values as bar heights, with each bar positioned along the x-axis. The visualization is built with D3.v4 and rendered as SVG, using `d3.selectAll('rect')` to bind data to existing rectangle elements. The code then sets each rectangle’s x, y, width, height, fill, and stroke attributes, where the y-coordinate is calculated as the container height minus the data value.

MMailnickko

88% match

Loading thumbnail…

fresh block

A bar chart displays six hardcoded numeric values as vertically scaled blue rectangles, with white strokes separating them. Each bar's height is proportional to the value divided by the maximum of the dataset, computed using `d3.max`. The chart renders in SVG via `d3.select` and `selection.append`, positioning bars with `attr('x')` based on their index and using a percentage-based height. The data is static, and the visualization uses d3.v4 without axes or labels.

MMilliners-Son

88% match

Loading thumbnail…

fresh block

A simple bar chart displays five blue rectangles of varying heights, encoding the array `[100, 250, 175, 200, 120]` as vertical bars. The visualization uses D3 v4 to bind data to SVG `rect` elements, setting their `x`, `y`, `width`, and `height` attributes with data-driven values. Each bar is positioned sequentially along the horizontal axis, with its height proportional to the data value and filled in solid blue with white strokes. The chart demonstrates basic data binding and attribute manipulation in SVG, without axes or scales.

BBenPiggot

88% match

Loading thumbnail…

fresh block

This example shows a simple bar chart rendered as a series of vertical rectangles, each with a fixed width and varying heights that step down from left to right. Built with D3 v4 and SVG, the code appends each rectangle directly to the document body, setting explicit x, y, width, and height attributes. A text element also displays an instructional message for the viewer. The data is hardcoded in the markup rather than loaded from an external source.

KKirun1

88% match