Skip to main content
SimilarExport ZIP
100%

Performance optimization Mutiple Wiews Missing Migrants on a Map With brush

✓ Published0🌍 Public
TTsaiJie
Last edited May 12, 2021
Created on May 12, 2021

This interactive visualization combines a natural Earth projection map of global missing migrant incidents with a linked time-series histogram. Users brush over the date histogram to filter the map’s bubble marks, which scale with reported deaths and missing persons using a square-root scale. The React app uses d3.geoNaturalEarth1, d3.geoPath for map rendering, and d3.brushX for interaction, drawing from 2019 Missing Migrants data and World Atlas TopoJSON.

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…

Mutiple Wiews Missing Migrants on a Map With brush

This interactive visualization combines a natural Earth projection map with a time-series histogram to explore missing migrants globally. The map uses `d3.geoNaturalEarth1` and `geoPath` to render circle marks scaled by the square root of casualties, while the histogram aggregates monthly totals using `d3.bin` and `scaleTime`. A `brushX` brush on the histogram filters the map’s data by date range, demonstrating linked views within a single SVG rendered with React and D3 v5. Data comes from the Missing Migrants Project CSV, with country boundaries from World Atlas TopoJSON.

TTsaiJie
94% match
Loading thumbnail…

Missing Migrants Multiple Views with Brushing React Performance Optimization

This visualization shows the geographic distribution and temporal trends of missing migrants worldwide, with a bubble map of incident locations and a linked date histogram for time-based filtering. Brushing the histogram filters the map’s circles in real time. Built with React and D3 v5, it uses `d3.geoNaturalEarth1` and `d3.geoPath` for map rendering, `d3.scaleSqrt` for bubble sizing, and `d3.brushX` for interactive selection, with `useMemo` and `useEffect` optimizing performance. Data comes from the Missing Migrants Project CSV.

MMichael Bergerson
92% match
Loading thumbnail…

Missing Migrants Multiple Views with Brushing

This interactive visualization combines a natural Earth projection bubble map of missing migrants with a linked brushing-enabled date histogram. The map uses d3.geoNaturalEarth1 and d3.geoPath to render world landmasses from TopoJSON, with circle radii scaled by d3.scaleSqrt based on total dead and missing counts. The histogram bins monthly totals via d3.bin and d3.timeMonths, and the d3.brushX selection filters map circles in real time. Both views use SVG rendering within a React framework, loading data from a CSV of Missing Migrants Global incidents.

KKevin McMorrow
92% match
Loading thumbnail…

Missing Migrants Multiple Views with Brushing

This interactive visualization combines a bubble map and a date histogram to explore global missing migrant incidents. Users brush over the histogram to filter the map, revealing the geographic distribution of deaths and missing persons within a selected time range. The map uses a natural Earth projection with proportional circle sizes for death counts, while the histogram aggregates monthly totals. Built with D3.js v7 and React, it employs `d3.geoNaturalEarth1`, `d3.geoPath`, `d3.bin`, `d3.brushX`, and `d3.scaleSqrt` for data processing and rendering as SVG elements. Data comes from a CSV of Missing Migrants Global incidents.

KKazushige Okuma
92% match
Loading thumbnail…

Missing Migrants Multiple View with Brushing

This interactive visualization combines a global bubble map and a time-series histogram to explore missing migrant incidents. Users can brush over the histogram to filter the map, which displays circles sized by the total dead and missing count. The map uses d3.geoNaturalEarth1 and d3.geoPath for geographic rendering, while the histogram employs d3.bin and d3.brushX for temporal aggregation and selection. Data comes from a CSV of missing migrants and world atlas TopoJSON, rendered with React and SVG.

JJohn Huang
91% match
Loading thumbnail…

Brushing Missing Migrants Multiple Views

This interactive visualization combines a world map and a time-series histogram to explore missing migrant incidents. Users can brush over the histogram to filter the map, which displays proportional circles sized by the total number of dead and missing individuals. The map uses a natural Earth projection with graticules and country borders, rendered with SVG via React. Data comes from the Missing Migrants Project and is aggregated by month using d3.bin. The linked views are implemented with d3.scaleSqrt for circle sizing and d3.brushX for the interactive selection.

TTatyana Milanova
91% match
Loading thumbnail…

Missing Migrants Multiple Views with Brushing

This visualization combines a bubble map and a date histogram to explore global missing migrant data from a CSV dataset. Users can brush across the histogram to filter the map by date range, with linked views updating simultaneously. The map uses d3.geoNaturalEarth1 projection and d3.geoPath for country boundaries, while the histogram applies d3.bin with timeMonths thresholds and d3.brushX for selection. React manages state for the brush extent, and d3.scaleSqrt sizes bubbles by the total dead and missing count.

MMichael Bergerson
91% match
Loading thumbnail…

Missing Migrants Multiple Views with Brush

This visualization presents global missing migrant incidents through a linked bubble map and time-based histogram. The map uses a natural Earth projection with translucent circles scaled by death counts, while the histogram aggregates monthly totals. A brush on the histogram filters the map’s displayed data in real time, enabling temporal exploration. Built with React and D3 v6, it employs `geoNaturalEarth1`, `scaleSqrt`, `bin`, `brushX`, and TopoJSON world atlas data from the Missing Migrants Project dataset.

RRMartins11
91% match