Skip to main content
SimilarExport ZIP
100%

Fork of Migrant Deaths Linked Views with Fast Brushing

✓ Published1🌍 Public
EEdison Gu
Last edited Jul 31, 2023
Created on Jul 30, 2023

This example links a geographic bubble map of New Jersey counties with a time-series histogram, using color and size to convey the annual salary of migrant deaths. Brushing the histogram filters the map, with the selected time range visually isolated on the map. The visualization is built with React and D3 v5, using `d3.geoMercator` and `d3.geoPath` for the map projection, `d3.scaleSqrt` for bubble sizing, and `d3.brushX` for the interactive filter. Data on migrant deaths and county boundaries are loaded from CSV and TopoJSON sources.

AI-generated description

A world map showing cities with population greater than 50,000. City data from Simplemaps: World Cities Database.

Country boundaries from World Atlas TopoJSON, polished for visual style, including graticules.

This iteration is optimized for performance using React's useMemo hook.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Migrant Deaths Linked Views with Fast Brushing

A geographic bubble map displays migrant deaths by location, linked to a time-series histogram below. The map uses a natural Earth projection with graticules, while the histogram shows monthly death counts. Brushing the histogram filters the map’s circles in real time. The visualization uses React with d3.js v5, including `d3.geoNaturalEarth1`, `d3.geoPath`, `d3.scaleSqrt`, `d3.scaleTime`, and `d3.brushX`. Data comes from a CSV of Missing Migrants records.

Eevers-codeshop-ai
92% match
Loading thumbnail…

Fork of Migrant Deaths Linked Views with Fast Brushing

This visualization combines a world bubble map of migrant deaths with a linked time-series histogram. Brushing on the histogram filters the map’s circles to show deaths within the selected date range. The map uses a d3.geoNaturalEarth1 projection via d3.geoPath, while the histogram uses d3.brushX, d3.bin, and scaleTime. React’s useMemo optimizes rendering. Data comes from the Missing Migrants Project CSV, with country boundaries from World Atlas TopoJSON.

Kka40
92% match
Loading thumbnail…

Fork of Migrant Deaths Linked Views with Fast Brushing

This visualization links a bubble map and a date histogram to explore migrant deaths, filtering the map to show only incidents within the brushed time range. The map uses a natural Earth projection with SVG circles sized by death counts, while the histogram aggregates monthly totals. Built with React and D3 v5, it uses `d3.geoNaturalEarth1`, `d3.geoPath`, `d3.brushX`, and `scaleSqrt`. Data comes from the Missing Migrants Global dataset, with the brush interaction triggering fast, reactive updates to the map.

Bbbarchu
91% match
Loading thumbnail…

Fork of Migrant Deaths Linked Views with Fast Brushing

This interactive visualization links a world map of migrant deaths with a brushable time-series histogram, enabling filtering by date range. The map uses d3.geoNaturalEarth1 projection, d3.geoPath, and TopoJSON world atlas data, with bubble sizes scaled by total dead and missing via d3.scaleSqrt. The histogram aggregates monthly totals using d3.bin and d3.sum, while React’s useMemo and a d3.brushX selection provide fast linked brushing. Data comes from a CSV of Missing Migrants Global records.

KKamal Bahadur Rana
91% match
Loading thumbnail…

Fork of Migrant Deaths Linked Views with Fast Brushing

This example shows migrant deaths with a world map and a brushing-linked histogram. A bubble map places circles sized by death counts using a square-root scale, while a time histogram below supports brushing to filter the map’s data. Built with React, it uses D3 v5 APIs such as `geoNaturalEarth1`, `geoPath`, `scaleSqrt`, `brushX`, and `bin`. Data comes from a CSV of Missing Migrants, with map boundaries from World Atlas TopoJSON.

Kkennethnwc
91% match
Loading thumbnail…

Fork of Migrant Deaths Linked Views with Fast Brushing

This interactive visualization combines a bubble map and a time-series histogram to explore migrant deaths worldwide. The map displays circles sized by the total dead and missing, while brushing the histogram filters the map’s circles in real-time. It uses React with `useMemo` for efficient rendering, D3 v5 for scales, `geoNaturalEarth1` projection, and `brushX` for linked selections. Data comes from a CSV of global migrant incidents, with country boundaries from World Atlas TopoJSON.

NNick-Brice
90% match
Loading thumbnail…

Fork of Migrant Deaths Linked Views with Fast Brushing

This interactive visualization combines a bubble map and a time-series histogram to explore migrant deaths worldwide. The map displays circles sized by the total dead and missing, while brushing the histogram filters the map’s circles in real-time. It uses React with `useMemo` for efficient rendering, D3 v5 for scales, `geoNaturalEarth1` projection, and `brushX` for linked selections. Data comes from a CSV of global migrant incidents, with country boundaries from World Atlas TopoJSON.

NNick-Brice
90% match
Loading thumbnail…

Fork of Migrant Deaths Linked Views with Fast Brushing

This interactive visualization links a world map and a time-series histogram to explore migrant deaths. A bubble map uses a square-root scale to plot the total number of dead and missing people per location, while a brushing tool on the date histogram filters the map's displayed circles in real time. Built with React and D3 v5, it employs `geoNaturalEarth1` and `geoPath` for the map, `brushX` for selection, and `scaleSqrt` for bubble sizing. Data comes from a CSV of Missing Migrants records, with country boundaries from World Atlas TopoJSON.

HHaowenWeiJohn
90% match