Scatter binned

100%

Scatter binned

✓ Published0🌍 Public

Last edited May 6, 2021

Created on May 6, 2021

Forked from Missing Migrants Scatter Plot

A scatter plot of the Missing Migrants Dataset aggregates individual events into monthly bins along the time axis, with bar heights representing the total dead and missing per month. The visualization uses React to structure SVG rendering, with D3.js providing `scaleTime`, `scaleLinear`, the `histogram` binning API, and `timeMonths` for threshold generation. Axes are constructed from custom React components that map scales to ticks and grid lines.

AI-generated description

A scatter plot of the Missing Migrants Dataset.

Each point in the plot represents a single event.

MIT Licensed

Similar vizzes

Loading thumbnail…

Missing Migrants Scatter Plot

This scatter plot visualizes monthly totals of dead and missing migrants, using D3 v5 to bin the data by reported date into monthly intervals. The visualization is built with React and renders as an SVG, combining a time-scaled x-axis and linear y-axis through `scaleTime`, `scaleLinear`, and histogram binning. Aggregated sums are plotted as circles, with the data sourced from a 2019 Missing Migrants Project CSV. Hovering over any circle reveals its exact value via a D3 tooltip.

Iiblub

91% match

Loading thumbnail…

Missing Migrants Scatterplot

This interactive visualization displays monthly counts of dead and missing migrants, aggregated from a CSV dataset of global incidents. The chart uses a scatterplot with time on the x-axis and death tolls on the y-axis, rendered as SVG bars via React. Built with d3.v5, it employs `scaleTime`, `scaleLinear`, and the `bin` histogram API with `timeMonths` thresholds to group data, while `sum` calculates monthly totals. Axes are custom components using React functional components, and hover tooltips reveal exact values through SVG `<title>` elements.

Jjulesgentry

89% match

Loading thumbnail…

Fork of Missing Migrants Scatter Plot

This visualization displays a bar chart of the Missing Migrants Dataset, showing the total number of dead and missing migrants per month over time. The code uses d3.csv for data loading, d3.scaleTime and d3.scaleLinear for axes, and d3.histogram with d3.timeMonths thresholds to bin events by month, summing the casualties. React components render SVG rect elements for each bar, with tooltips via the title element. The visualization is drawn with D3 v5 and React 16.9, using Poppins font styling.

Wweny1109

88% match

Loading thumbnail…

React Scatter Plot: Missing Migrants w/ Log Scale

This React-based scatter plot visualizes missing migrant incidents over time, with each point representing a single event and the y-axis using a log scale to accommodate the wide range of reported dead and missing counts. The code uses d3.scaleTime, d3.scaleLog, and d3.bin to aggregate monthly totals, while rendering circles as SVG marks. The visualization filters out events with counts of one or fewer, and uses data from the Missing Migrants Dataset, with axes and labels drawn via custom D3 components within a React component hierarchy.

Hhunsingeruk@gmail.com

88% match

Loading thumbnail…

Fork of Missing Migrants Scatter Plot

This visualization shows monthly totals of dead and missing migrants from the Missing Migrants Dataset, displayed as a bar chart over time. The dataset is loaded via `d3.csv` and processed with `d3.bin` and `d3.timeMonths` to aggregate individual events. React components render SVG axes and marks, with scales created via `d3.scaleTime` and `d3.scaleLinear`. A tooltip using SVG `<title>` elements reveals exact values on hover.

Uuplusv

88% match

Loading thumbnail…

D3 course - Missing Migrants

This scatter plot visualizes the Missing Migrants dataset, showing each event as a point with its reported date on the x-axis and total dead and missing on the y-axis. Users can toggle between raw data, monthly bins, and annual bins via radio buttons, which aggregate events using d3.bin with time thresholds. The visualization uses d3.scaleTime, d3.scaleLinear, and d3.scaleSqrt for scaling, with circles colored by a linear color scale from orange to dark red based on severity. Data is loaded from a CSV file and rendered using React with SVG elements, incorporating tooltips that display event details on hover.

JJames Rhodes

88% match

Loading thumbnail…

Missing Migrants Scatter Plot

This scatter plot visualizes the Missing Migrants Dataset, where each point represents a single migration event, plotting reported dates against the total number of dead and missing. The visualization uses React with D3 v7 scales (scaleTime and scaleLinear) to map data to SVG circles. The code loads data via d3.csv and renders axes using custom React components, with tooltips provided through SVG title elements on each circle.

JJoe Hutchins

88% match

Loading thumbnail…

Missing Migrants Scatter Plot

A scatter plot visualizes the Missing Migrants Dataset, showing each reported event as a point along a time axis against the total number of dead and missing. The plot uses d3.scaleTime and d3.scaleLinear for axes, with React components rendering SVG circles for marks. Data is loaded via d3.csv from a gist, and the axis labels and tick marks are generated using d3 time formatting.

Jjwlam83

88% match