Skip to main content
SimilarExport ZIP
100%

Working With Time with Migrants

✓ Published0🌍 Public
KKtuzinowski
Last edited Dec 18, 2022
Created on Jul 29, 2021

This histogram visualizes the monthly totals of dead and missing migrants from a CSV dataset, plotting time on the x-axis and aggregated counts on the y-axis. Using React with D3 v5, the code employs `scaleTime` and `scaleLinear` for axes, `timeMonths` to define bin thresholds, and `sum` to aggregate values per bin. Bars are rendered as SVG rectangles, with axis ticks and labels generated by custom components.

AI-generated description

Scatterplot of iris dataset

MIT Licensed

Similar vizzes

Loading thumbnail…

working with time

This visualization displays the total number of dead and missing migrants over time, using a histogram with monthly bins. The data comes from a CSV file of missing migrants incidents and is processed with `d3.csv` and `d3.histogram`. React renders SVG elements, with axes drawn from custom components using `d3.scaleTime` and `d3.scaleLinear`. Circles mark each bin’s total, colored blue with opacity, and the time axis formats dates using `d3.timeFormat`.

MMATTE-blz
94% match
Loading thumbnail…

Working with Time

This example visualizes the monthly totals of dead and missing migrants from a global dataset, using a bar chart where time is mapped to the x-axis and cumulative counts to the y-axis. The React app loads CSV data via d3.csv, parses dates and numbers, and computes bins with d3.bin and timeMonths. SVG marks are rendered through React components, with scales from d3.scaleTime and d3.scaleLinear, and axes built using custom React components that leverage d3’s tick generation.

KKai Stewart
92% match
Loading thumbnail…

Missing Migrant of Working with Time

This histogram shows the monthly total of dead and missing migrants over time, based on data from the Missing Migrants Project subset. The visualization uses a bar chart with time on the x-axis and the aggregated death count on the y-axis, with hover tooltips displaying exact values. Built with React and D3 v5, it leverages `d3.scaleTime`, `d3.bin` with `timeMonths` thresholds, and `d3.sum` to aggregate the data, while custom SVG components like AxisBottom, AxisLeft, and Marks render the chart. The code loads CSV data via `d3.csv` and renders as SVG.

SSong Tao Chen
91% match
Loading thumbnail…

Working with time

This visualization displays monthly totals of dead and missing migrants along global routes, drawing on a 2019 Missing Migrants dataset. It aggregates reported incident dates into monthly bins using d3.bin and d3.timeMonths, then renders the aggregated sums as bars. The React application uses d3.scaleTime for the x-axis and d3.scaleLinear for the y-axis, with custom SVG axis components and marks. A tooltip on each bar reveals the precise monthly count via a d3 title element.

JJosh Zalcman
91% match
Loading thumbnail…

Time - Migrant Death Data

This example shows the number of missing migrants over time as a histogram, with monthly bins of reported dates on the x-axis and the total dead and missing on the y-axis. It uses d3’s `scaleTime`, `timeMonths`, and `histogram` to bin the data, and React components render SVG axes and marks. The dataset is loaded via d3.csv from a GitHub gist, and tooltips display exact counts on hover.

AAndres de la Garza
91% match
Loading thumbnail…

Fork of Working with Time

This visualization displays the total number of dead and missing migrants over time, binned by month to reveal temporal trends. The React-based code uses d3.csv to load the Data Canvas Sense Your City dataset, then applies d3.scaleTime, d3.scaleLinear, and d3.bin with d3.timeMonths thresholds to aggregate and render the histogram. Custom SVG axes are drawn with d3.ticks and timeFormat labels, while a native SVG `<title>` element provides hover tooltips. The interactive chart appears static but relies on React’s useEffect hook for asynchronous data loading and conditional rendering.

Qqtrfx
89% match
Loading thumbnail…

Migrants

This visualization displays the total number of dead and missing migrants over time as a histogram. The code uses React and D3 v5, with CSV data loaded via `d3.csv`. The x-axis shows time using `d3.scaleTime`, while the y-axis is scaled using `d3.scaleLinear`. The bars, rendered via SVG rectangles, aggregate the data into monthly bins using `d3.histogram` and `d3.timeMonths`. The visualization uses Poppins font and custom axis components, with a tooltip showing the exact count.

LLawrence Liu
89% match
Loading thumbnail…

Fork of Working with Time

This histogram displays the total number of dead and missing migrants over time, with monthly bins aggregated from the Data Canvas Sense Your City dataset. The visualization uses React components for the axes and marks, with d3.scaleTime and d3.scaleLinear for scales. The data is loaded via d3.csv and processed using d3.histogram, d3.timeMonths, and d3.sum to create the bar chart rendered as SVG rectangles.

RRajat Dangat
89% match