Migrants Multi View w/ Brushing (Performance Optimized)

100%

Migrants Multi View w/ Brushing (Performance Optimized)

✓ Published1🌍 Public

Last edited Mar 23, 2021

Created on Mar 23, 2021

Forked from Migrants Multi View w/ Brushing

This interactive visualization combines a bubble map of migrant deaths with a time-series histogram, linked through brushing. Dragging across the histogram filters the map to show incidents within the selected date range. The map uses `d3.geoNaturalEarth1` projection and `d3.geoPath` to render world landmasses, while circle size encodes the total dead and missing via `d3.scaleSqrt`. The histogram bins data monthly using `d3.histogram` and `d3.timeMonths`, with a `d3.brushX` for interactive filtering. All rendering uses SVG within a React framework, with performance optimized through `useMemo` and `d3.v5`.

AI-generated description

Scatter Plot with time series data. All date and time data needs to follow (ISO 8601) time and date formatting for proper plotting. [https://en.wikipedia.org/wiki/ISO_8601].

MIT Licensed

Similar vizzes

Loading thumbnail…

Migrants Multi View w/ Brushing

This visualization shows a map of missing migrants alongside a time-series histogram, with interactive brushing to filter data across both views. Geographic coordinates are plotted as bubbles on a natural Earth projection using `d3.geoNaturalEarth1` and `d3.geoPath`, sized by the square-root scale of the total dead and missing count. A lower date histogram, built with `d3.bin` and `d3.timeMonths`, uses `d3.brushX` to select a temporal range, which dynamically filters the rendered circles on the map. The React-sourced data comes from a CSV of Missing Migrants Global records rendered as SVG.

AAndres de la Garza

93% match

Loading thumbnail…

Fork of Migrants Multi View w/ Brushing (Performance Optimized)

This visualization combines a world map of migrant deaths with a linked time-series histogram. A brush on the histogram filters the map’s circles by date range. The map uses a D3 natural Earth projection with clipped graticules, while the histogram bins monthly totals. React manages state, and D3’s `brushX` and `scaleSqrt` drive the interaction and circle sizing. Data comes from a CSV of global missing migrant incidents.

AAndres de la Garza

92% match

Loading thumbnail…

Migrant Deaths Linked Views with Brushing

This interactive visualization uses a world map and a time-series histogram to explore migrant deaths. A linked brushing interface in the date histogram filters the bubble map, which uses `d3.geoNaturalEarth1` and `d3.geoPath` to render circle sizes proportional to deaths. The histogram bins data by month using `d3.histogram` and `brushX`. Data comes from the Missing Migrants Project, with country boundaries from World Atlas TopoJSON. React's `useMemo` optimizes rendering of the SVG marks.

Nnkohdatavis

92% match

Loading thumbnail…

Migrant Deaths Linked Views with Brushing

This interactive visualization combines a world bubble map with a time-series histogram to explore migrant deaths and disappearances. Users can brush a time range in the histogram to filter which incidents appear on the map, linking the two views. The map uses a natural Earth projection via `d3.geoPath`, with circle radii scaled by the square root of the death count. The histogram aggregates monthly totals using `d3.bin`, and brushing is implemented with `d3.brushX`. Data comes from the Missing Migrants Project CSV, rendered with React and SVG.

HHwl98

92% match

Loading thumbnail…

Migrant Deaths Linked Views with Brushing

This interactive visualization combines a world map of migrant deaths with a linked time-series histogram. Users brush over the date histogram to filter the map’s bubble marks, which encode the total dead and missing per location. The map uses `d3.geoNaturalEarth1` with `d3.geoPath` for land, graticules, and interiors, while the histogram uses `d3.brushX` and `d3.bin`. React hooks like `useMemo` manage scales and filtered data, with data sourced from a CSV of missing migrants.

SSam

92% match

Loading thumbnail…

Migrant Deaths Linked Views with Brushing

This interactive visualization combines a bubble map and a brushing-linked date histogram to explore migrant deaths recorded in 2019. The map uses a natural Earth projection with `d3.geoPath` to render country boundaries and graticules, while circle size encodes the total dead and missing per location. The histogram aggregates deaths by month using `d3.bin` and `d3.timeMonths`. Users can brush over the time axis with `d3.brushX`, filtering the map’s circles to show only incidents within the selected date range. Data comes from a CSV of the Missing Migrants Project, rendered as SVG with React’s `useMemo` for performance.

NNikhil

92% match

Loading thumbnail…

Migrant Deaths Linked Views with Fast Brushing

This interactive visualization combines a bubble map and a date histogram to explore migrant deaths worldwide. The map displays circles sized by the total dead and missing count, while the histogram shows the same data binned by reported date. Users brush along the histogram’s time axis to filter the map’s circles in real time, using a `brushX` interaction that updates React state. Built with React and D3 v5, it uses `geoNaturalEarth1` projection, `geoPath`, and `scaleSqrt` for sizing, with data from the Missing Migrants Project.

TTatyana Milanova

92% match

Loading thumbnail…

Missing Migrants Multiple Views wtih Brushing

This interactive visualization combines a bubble map and a time-series histogram to explore global migrant deaths. The map uses D3's `geoNaturalEarth1` projection and `geoPath` to render landmasses, with circle size scaled by the square root of the total dead and missing. A brushable date histogram, built with `scaleTime` and `histogram`, allows users to filter the map by date range, dynamically updating the displayed data. Both views are implemented as React components using D3 scales and SVG rendering.

Nnpelliccia

92% match