Skip to main content
SimilarExport ZIP
100%

migrants dead and missing React and D3

✓ Published0🌍 Public
Bblackbottt
Last edited Jun 10, 2022
Created on Jun 1, 2022

This visualization displays monthly totals of dead and missing migrants from a global 2019 subset dataset. The React app loads CSV data with `useData` and `d3.csv`, then uses `d3.bin()` with `timeMonths` thresholds to aggregate daily records into monthly intervals, which are rendered as pink SVG rectangles. Axes are generated using `d3.scaleTime` with a `%d/%m/%y` time format for the bottom axis and `d3.scaleLinear` for the left axis. All marks and axes are implemented as reusable React components, rendered through ReactDOM into an SVG container.

AI-generated description

working with time weekly_temp SA

MIT Licensed

Similar vizzes

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
92% match
Loading thumbnail…

missing migrant

This visualization displays the total number of dead and missing migrants over time, aggregated into monthly bins as a histogram. The code uses d3.csv to load data from the Missing Migrants Global 2019 dataset, d3.bin and d3.timeMonths to create temporal bins, and d3.scaleTime and d3.scaleLinear for the axes. React renders the SVG graphic, with d3’s timeFormat used for tick labels and native SVG `<title>` elements providing tooltips. The chart is built using d3 v5 within a React 16 application.

TTsaiJie
91% match
Loading thumbnail…

Missing Migrant

This visualization shows the monthly count of dead and missing migrants over time, with bars representing the aggregated total for each month. It uses React with D3 v5 to load CSV data via `d3.csv`, bin the reported dates using `d3.histogram` with `d3.timeMonths` thresholds, and sum the “Total Dead and Missing” values per bin. Axes are rendered with custom SVG components, and a `<title>` element provides hover tooltips. The data comes from the Data Canvas Sense Your City dataset.

Tthomasjungcoe
91% match
Loading thumbnail…

Dataviz 11 - Missing migrants #2

This histogram visualizes the number of dead and missing migrants over time, with each bar representing cumulative fatalities per month. Built with React and D3 v5, it uses `d3.csv` to load a subset of the Missing Migrants Global dataset, `scaleTime` and `scaleLinear` for axes, and `bin()` with `timeMonths` thresholds to aggregate data. SVG rectangles render the bars, with tooltips via SVG `<title>` elements. The visualization includes labeled axes for "Time" and "Total Dead and Missing," styled with a Poppins font.

RRyAlpha
90% match
Loading thumbnail…

Missing Migrants 2

This visualization shows monthly totals of dead and missing migrants from a subset of the Missing Migrants Global dataset, with time on the x-axis and count on the y-axis as a bar chart. It loads CSV data via D3’s `csv` utility, bins entries by month using `d3.histogram` with `timeMonths` thresholds, and sums the total dead and missing per bin. The chart is rendered as SVG using React components, with axes from custom `AxisBottom` and `AxisLeft` components and bars from a `Marks` component, all styled via CSS.

NNikita Toropov
90% match
Loading thumbnail…

migrant data part 1

This visualization displays the total number of dead and missing migrants over time, aggregated into monthly bins. The chart uses a bar chart rendered with SVG, with time on the x-axis and cumulative death counts on the y-axis. It is built with React and D3 v7, using `d3.bin` for binning, `d3.scaleTime` and `d3.scaleLinear` for scales, and `d3.timeMonths` to set bin thresholds. Data comes from a CSV file of Missing Migrants Global records, loaded via `d3.csv`.

BBlake McCarty
90% match
Loading thumbnail…

Analyzing Missing Migrants

This visualization analyzes missing migrant data by showing the total number of dead and missing individuals aggregated by month, displayed as a bar chart with time on the x-axis and counts on the y-axis. The code uses React with D3 v5, employing `d3.csv` for data loading, `d3.scaleTime` and `d3.scaleLinear` for scales, and `d3.histogram` with `d3.timeMonths` to bin the daily records into monthly totals. Each bar includes a tooltip showing the exact monthly count, rendered as an SVG with custom axis components.

MMichael Bruno
90% match
Loading thumbnail…

Missing and dead migrants I

This visualization plots the number of dead and missing migrants over time, using a line chart with circular markers for each reported incident. The chart is built with React and rendered as SVG, with scales from d3.scaleTime and d3.scaleLinear, and lines generated via d3.line with curveNatural interpolation. Data comes from the Missing Migrants Project subset, loaded with d3.csv. The axes are custom React components, and tooltips show the reported date for each point.

Ssmile2git
90% match