Skip to main content
SimilarExport ZIP
100%

Multiple Views with Fast Brushing

✓ Published0🌍 Public
Jjessand4
Last edited Nov 18, 2019
Created on Nov 18, 2019

This visualization displays global migration incidents with a bubble map showing the total number of dead and missing migrants per city, filtered by a linked date histogram below. Brushing a time range in the histogram updates the map’s circles in real time, using React’s `useState` and D3’s `brushX`, `scaleSqrt`, `geoNaturalEarth1`, and `geoPath`. Data comes from the Missing Migrants Project CSV, with country boundaries from World Atlas TopoJSON, rendered as SVGs.

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…

Multiple Views (Brushing)

This interactive visualization combines a bubble map and a date histogram to explore missing migrant incidents. Brushing a time range in the histogram filters the map’s bubbles, which are scaled by total dead and missing using d3.scaleSqrt. The map uses d3.geoNaturalEarth1 and d3.geoPath for land outlines, while the histogram employs d3.bin and d3.brushX. Data comes from the Missing Migrants Project CSV, rendered as SVG in React.

Bbsolomon103
93% match
Loading thumbnail…

Multiple Views with Fast Brushing

Two coordinated views visualize migrant deaths and disappearances worldwide. A bubble map uses `d3.geoNaturalEarth1` and `d3.geoPath` to draw country boundaries, graticules, and scaled circles for filtered data. Below it, a time histogram built with `d3.bin` and `d3.scaleTime` shows monthly death totals; brushing with `d3.brushX` filters the map reactively, updating circles through React state. Data comes from a CSV of missing migrants, while country shapes use TopoJSON from the world-atlas package.

EErik Erickson
93% match
Loading thumbnail…

Multiple Views with Fast Brushing

A world map displays migrant deaths and missing persons by location, with circle size scaled to the count. A synchronized date histogram below supports brush selection, filtering the map’s circles in real time. Built with React, D3 v5, and SVG, it uses `d3.geoNaturalEarth1` and `d3.geoPath` for the map, `d3.brushX` for brushing, and `useMemo` for performance. Data comes from the Missing Migrants Project and World Atlas TopoJSON.

Mmkt-ds
92% match
Loading thumbnail…

Multiple Views with Fast Brushing

This visualization combines a world map and a time-series bar chart to explore migrant deaths and disappearances. Users brush a date range on the histogram to filter the map’s circle markers, which scale by the number of casualties. The map uses `d3.geoNaturalEarth1` and `d3.geoPath` for landmasses, while the histogram bins monthly totals via `d3.bin` and `brushX`. Data comes from a CSV of global missing migrant incidents, rendered with React and D3 v5.

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

Multiple Views with Brushing

A world map displays circles sized by the total number of dead and missing migrants, with a linked time-series histogram below showing monthly totals. Brushing a date range on the histogram filters the map circles to only those incidents within that period. The visualization uses React with D3 v5, employing `d3.geoNaturalEarth1` for the map projection, `d3.brushX` for interactive selection, and `d3.bin` with `d3.timeMonths` for histogram binning. Data comes from a CSV of global missing migrants, rendered as SVG.

Wwindwaver
92% match
Loading thumbnail…

Multiple Views with Brushing - Working

This example displays migration incidents on a world map with bubble markers sized by the total number of dead and missing, alongside a time-series histogram of the same metric. A brushable time range on the histogram filters the map’s bubbles to show only incidents within the selected period, demonstrating linked views. The visualization uses React, D3 version 5, and SVG rendering, with `d3.geoNaturalEarth1` for the map projection, `d3.brushX` for brushing, and data from the Missing Migrants Project.

RRMartins11
92% match