fresh block

100%

✓ Published0🌍 Public

Last edited Mar 19, 2017

Created on Mar 19, 2017

A stacked bar chart titled “Batallion Performance Assessment” displays monthly military data from April 1854 to March 1856, with segments for wounds, other causes, and disease. The chart uses d3.stack with keys for each cause, d3.scaleBand for the monthly y-axis, and d3.scaleLinear for the x-axis. Rendered as SVG via d3.v4, the bars are colored using d3.scaleOrdinal and d3.schemeCategory20. The visualization sorts months by total personnel, showing how disease dominated casualties early on, while wound counts rise later.

AI-generated description

Built with blockbuilder.org

forked from <a href='http://bl.ocks.org/Goomble/'>Goomble</a>'s block: <a href='http://bl.ocks.org/Goomble/c3d7a0a8ef0a1734987642e8303736c1'>fresh block</a>

mit Licensed

Similar vizzes

Loading thumbnail…

fresh block

A stacked bar chart displays the causes of mortality—wounds, other, and disease—among a historical population over several months in 1855–1856. The visualization uses a horizontal orientation, with each bar segmented by cause and colored via a categorical scale. Built with D3 v4, it employs `d3.stack()` to compute layer positions, `d3.scaleBand` for the time-based y-axis, and `d3.axisBottom` and `d3.axisLeft` for axes. Data is parsed with `d3.timeParse` and rendered as SVG rectangles.

KKacieW

86% match

Loading thumbnail…

fresh block

This stacked bar chart visualizes historical death data from the Crimean War, breaking down monthly mortality into categories of disease, wounds, and other causes. The implementation uses D3 v4's `d3.stack`, `d3.stackOffsetNone`, and `d3.scaleBand` for the time-based y-axis and linear x-axis. It sorts months by total deaths and renders layers via SVG rectangles, with axes configured through `d3.axisLeft` and `d3.axisBottom`. The color scheme uses `d3.schemeCategory20` to distinguish the three mortality categories.

GGoomble

86% match

Loading thumbnail…

fresh block

A small SVG bar chart displays three horizontal stacked bars for consecutive months, with two colored series per month. The chart uses a custom d3.layout.stack() transform to compute stacked sums, then maps each bar’s width to its value and positions groups via d3.scale.ordinal() and rangeRoundBands. A yellow legend panel lists series names with color swatches, and hovering a segment updates a tooltip via d3.select() and d3.classed(). Data is hardcoded as JavaScript arrays in the block.

GGoomble

82% match

Loading thumbnail…

fresh block

This horizontal stacked bar chart displays fire department staffing by district, breaking down personnel counts across seven roles such as TRUCK, ENGINE, and MEDIC. Built with d3.v4, it uses `d3.stack()` with `d3.stackOffsetNone` to compute layers, `d3.scaleBand` for the categorical y-axis, and `d3.scaleLinear` for the quantitative x-axis. The SVG elements are colored via `d3.scaleOrdinal` with `d3.schemeCategory20`, and axes are rendered using `d3.axisBottom` and `d3.axisLeft`, with data loaded from a CSV file.

GGoomble

80% match

Loading thumbnail…

fresh block

A horizontal bar chart displays the number of assault incidents by resolution type, with purple bars extending from a shared left axis. The visualization uses D3 v4’s `d3.scaleLinear` for the x-axis and `d3.scaleBand` for the categorical y-axis, rendering SVG rectangles for each bar. Data from the CSV is loaded via `d3.csv`, and axes are drawn with `d3.axisBottom` and `d3.axisLeft`, including a grid of horizontal tick lines. The chart highlights that "NONE" is the most common resolution, while "EXCEPTIONAL CLEARANCE" and "UNFOUNDED" are the rarest.

GGoomble

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

79% match

Loading thumbnail…

fresh block

A horizontal bar chart displays the number of cases by resolution type, using d3.scaleBand for the categorical y-axis and d3.scaleLinear for the numeric x-axis. Rectangles represent each value, with a custom tooltip showing the category and amount on mouseover. Data loads from a CSV file via d3.csv, and axes are drawn with d3.axisBottom and d3.axisLeft under d3.v4.

GGoomble

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

78% match