D3 bin(histogram) aggregated by months

100%

D3 bin(histogram) aggregated by months

✓ Published0🌍 Public

Last edited Oct 9, 2023

Created on Oct 9, 2023

A bar chart aggregates monthly totals of dead and missing migrants from a 2023 subset of the Missing Migrants Project data. D3’s `bin()` with `timeMonths` thresholds groups the data, while `scaleTime` and `scaleLinear` position bars. The SVG renders React components for axes and marks, with simple `<title>` tooltips.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Missing Migrants Project - Aggregation Function

This histogram displays monthly totals of dead and missing migrants from the Missing Migrants Project dataset, with bars representing aggregated counts over time. The React-based visualization uses d3.csv for data loading, d3.bin with timeMonths thresholds to group records, and d3.sum to calculate monthly totals. SVG rendering with d3.scaleTime and d3.scaleLinear positions the bars, while tooltips show exact values on hover.

SSam Hege

87% match

Loading thumbnail…

Missing Migrants Bar Chart (binned)

This bar chart visualizes the monthly counts of dead and missing migrants, using binned time-series data from a CSV of global migrant incidents. The visualization aggregates reported dates into monthly bins via d3.bin and timeMonths, summing the "Total Dead and Missing" values per bin with d3.sum. A time scale maps dates to the x-axis, while a linear scale handles the y-axis counts. The React-based component renders SVG rectangles for each bin, with axes generated through custom components and D3's scaleTime, scaleLinear, and timeFormat utilities.

RRichardPearce60

87% match

Loading thumbnail…

Missing Migrant Histogram

This histogram visualizes the cumulative count of dead and missing migrants over time, derived from a global dataset sourced via a GitHub-hosted CSV. The D3.js v6 `bin` and `timeMonths` APIs aggregate the data into monthly bins, which are then rendered as SVG rectangles. React manages the interactive chart’s composition, while D3’s `scaleTime` and `scaleLinear` handle axes, along with custom axis components. The visualization highlights temporal trends in migrant fatalities, with a tooltip providing exact totals per bin.

CCodeDuckie99

86% match

Loading thumbnail…

Missing migrant

A histogram displays the monthly count of dead and missing migrants from the Missing Migrants Project dataset. React renders an SVG chart using D3 scales and axes, with `d3.bin` and `timeMonths` aggregating reported dates, and `d3.sum` totaling fatalities per bin. Color-coded bars show the distribution over time, with axis labels and tooltips providing precise values.

SShuyu Zheng

86% match

Loading thumbnail…

Fork of Missing Migrants Date Histogram

This histogram visualizes the total number of dead and missing migrants per month using data from the Missing Migrants Dataset. It aggregates reported date values into monthly bins via `d3.bin` and calculates each bar’s height with `d3.sum`. The React-based SVG chart, authored with D3 v5, uses `scaleTime` and `scaleLinear` for axes, with axis components and marks rendered as reusable React components. Bars display tooltips on hover, and the time axis auto-generates ticks via `xScale.ticks()`.

Eelena

86% match

Loading thumbnail…

Missing and dead migrants II

This visualization presents a bar chart of the total number of dead and missing migrants aggregated by month. The code bins the raw data using `d3.bin` and `d3.timeMonths`, calculates the sum per bin, and renders the result as SVG rectangles via React, using D3 scales for positioning. The chart uses the Missing Migrants Dataset from a GitHub gist. Tooltips expose the precise dead and missing count for each month.

Ssmile2git

86% match

Loading thumbnail…

Missing migrants

This visualization shows the total number of dead and missing migrants reported per month, using a bar chart where each bar aggregates monthly totals. The code loads a CSV dataset of migrant incidents, bins the reported dates into monthly intervals using `d3.bin` with `timeMonths` thresholds, and sums the "Total Dead and Missing" values per bin. React manages the component state while D3 scales (`scaleTime`, `scaleLinear`) and axes render the SVG output. Axes are formatted with `timeFormat`, and tooltips display raw values via SVG `<title>` elements.

MmohitPassan

86% match

Loading thumbnail…

Fork of Missing Migrants Date Histogram

This interactive bar chart displays the monthly totals of dead and missing migrants, with each bar representing one month and height proportional to the aggregate count. The visualization uses React for component structure, with D3 v5 handling data processing and scales. It demonstrates d3.bin for time-binning and d3.sum for aggregating values, rendering bars as SVG rectangles. Data comes from the Missing Migrants Dataset, loaded via d3.csv, with axes customized using scaleTime and scaleLinear.

Mmp7090

86% match