Skip to main content
SimilarExport ZIP
100%

Multiple Views with Brushing

✓ Published0🌍 Public
XXiaoleiGuo
Last edited Aug 23, 2020
Created on Aug 23, 2020

Two synchronized views explore migrant deaths and disappearances: a bubble map using a natural Earth projection and a time-series histogram. Brushing a time range in the histogram filters the map’s circles, which are scaled by the square root of the total dead and missing. The React app uses `d3.geoNaturalEarth1`, `d3.geoPath`, `d3.scaleSqrt`, and `d3.brushX`, with country boundaries from World Atlas TopoJSON and city data from Simplemaps. SVG rendering shows graticules, landmasses, and interactive months.

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.

MIT Licensed

Similar vizzes

Loading thumbnail…

Multiple Views with Brushing

This interactive visualization combines a bubble map and a date histogram to explore migrant deaths and disappearances worldwide. The map displays incidents as proportional circles overlaid on natural Earth projections using `d3.geoNaturalEarth1` and `d3.geoPath`, while the histogram aggregates monthly totals. Users can brush the time axis with `d3.brushX` to filter the map’s displayed incidents in real time. Both views use SVG rendering within a React framework, with data sourced from the Missing Migrants Project CSV and country boundaries from World Atlas TopoJSON.

GGeniXiong
94% match
Loading thumbnail…

Multiple Views with Brushing

This example pairs a natural Earth bubble map with a time-series histogram, both rendered as SVG, to visualize global migrant deaths and disappearances. Brushing on the histogram filters the map’s circles in real time, showing only incidents within the selected date range. The map uses `d3.geoNaturalEarth1` and `d3.geoPath` for projections and country boundaries from TopoJSON, while the histogram aggregates monthly totals with `d3.bin` and `d3.sum`. Data comes from the Missing Migrants Project, with circle sizing scaled by `d3.scaleSqrt`. React manages state, and D3’s `brushX` drives the interactive filtering.

ZZG
94% match
Loading thumbnail…

Multiple Views with Brushing

Two coordinated views show migrant deaths and disappearances worldwide. A bubble map projects incidents using `d3.geoNaturalEarth1` and `geoPath`, with circle radii scaled by `scaleSqrt`. A time histogram beneath aggregates monthly totals using `d3.bin` and `sum`. Interactive `brushX` brushing filters map circles by date range, linking the views. Data comes from the Missing Migrants Project CSV, rendered as SVG in React with D3 v5.

Jj-PGi
94% match
Loading thumbnail…

Multiple Views with Brushing

This example combines a world map and a time-series histogram to visualize migrant deaths. The map uses a natural Earth projection with graticules and land outlines, while circles sized by square-root scaling represent the dead and missing. The histogram bins the same data by date, and its interactive brush selection filters the map's circles, demonstrating linked views. The visualization uses React components, D3’s `geoNaturalEarth1`, `geoPath`, `scaleSqrt`, `bin`, and `brushX` for the interaction, with data sourced from a CSV of missing migrants.

KKai Stewart
94% match
Loading thumbnail…

Multiple Views with Brushing

This example shows a world map of missing migrant incidents, with bubbles sized by the total number of dead and missing. A time-series histogram below the map displays the same data binned by month. Brushing the histogram filters the map’s bubbles in real time. The visualization uses React for the component structure and `d3.geoNaturalEarth1` with `d3.geoPath` for the map, alongside `d3.brushX` and `d3.scaleTime` for the interactive filtering.

Ee-ines
94% match
Loading thumbnail…

44) Multiple Views with Brushing

This visualization combines a geographic bubble map with a time-series histogram to explore migrant deaths and disappearances. The map displays circles sized by the square-root-scaled count of total dead and missing, using D3’s `geoNaturalEarth1` projection and `geoPath` for the world atlas. The histogram aggregates the same data by month, using D3’s `bin` and `scaleTime`. Brushing on the histogram, implemented with `brushX`, filters the map’s data points. The map and histogram are linked, with the map updating dynamically to show only records within the brushed date range.

Llefat92
93% match
Loading thumbnail…

Multiple Views with Brushing

This interactive visualization combines a bubble map and a date histogram to explore migrant deaths and missing persons. Users can brush a time range in the histogram to filter the map’s displayed circles, which are sized using `d3.scaleSqrt` and positioned with `d3.geoPath` and `geoNaturalEarth1`. A reactive `useState` hook manages the brush extent. The map shows city locations from a CSV dataset, with country boundaries from World Atlas TopoJSON, all rendered as SVG with React and D3 v5.

CCurran Kelleher
93% match
Loading thumbnail…

Multiple Views with Brushing

This interactive visualization combines a world map and a time series histogram to explore migrant deaths and disappearances. The map displays circles sized by death counts using d3.geoNaturalEarth1 and d3.geoPath, while the histogram aggregates monthly totals with d3.histogram. Brushing on the histogram filters the map’s data through a brushX interaction, updating the circles in real time. The data comes from the Missing Migrants Project CSV, rendered as SVG within a React framework.

Nnkohdatavis
93% match