Interactable time table

100%

Interactable time table

✓ Published0🌍 Public

Last edited Jan 15, 2020

Created on Jan 15, 2020

This interactive visualization combines a world bubble map with a time-series histogram to explore migrant deaths and disappearances. The map uses a natural Earth projection via `d3.geoPath` to plot circles scaled by the number of dead and missing, while the histogram below aggregates the same data by reported date using `d3.bin` and `scaleTime`. A brush on the histogram filters the map’s circles, dynamically updating the visualization. Built with React and D3 v5, it sources data from a Missing Migrants CSV and country boundaries from TopoJSON.

AI-generated description

The final installment from the online course Datavis 2020.

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…

Interactable time table

This interactive visualization combines a world map and timeline chart to explore global migrant deaths. A bubble map uses `d3.geoNaturalEarth1` and `d3.geoPath` to project circles scaled by total dead and missing, with country boundaries and graticules from TopoJSON. A linked date histogram, powered by `d3.brushX` and `d3.bin`, allows brushing to filter the map in real time. The data comes from a CSV of migrant incidents, rendered with React and D3 v5.

JJunyanL

96% match

Loading thumbnail…

Interactable time table

This interactive visualization combines a world map of missing migrant incidents with a linked time-series histogram. The map uses a natural Earth projection rendered with `d3.geoPath` to plot bubble-scaled circles representing the total dead and missing at each location, while a brushable histogram below allows filtering the map by reported date. React hooks like `useMemo` optimize rendering performance, and the data comes from the Missing Migrants Project dataset. The visualization is built with React, D3 v5, and TopoJSON for country boundaries.

ZZY Huang

95% match

Loading thumbnail…

Interactable time table

A world map displays circles sized by the total number of dead and missing migrants, with country boundaries and graticules rendered via d3.geoPath and geoNaturalEarth1. A brushed time histogram below, built with d3.brushX and scaleTime, filters the map to show only incidents within the selected date range. Data comes from the Missing Migrants Project dataset, and the visualization uses React's useMemo for performance.

AAinaLluv

91% match

Loading thumbnail…

Multiple view

This interactive visualization combines a world map with a time-series histogram to explore migrant deaths and disappearances. A bubble map projects incident locations using `d3.geoEqualEarth` and `d3.geoPath`, with circle sizes scaled by the square root of the death count. The histogram aggregates monthly totals, and users can brush over its time axis to filter the map’s bubbles accordingly. The visualization is built with React and renders all graphics as SVG, using data from the United Nations World Population Prospects and the Missing Migrants Project.

33ssalunke

87% match

Loading thumbnail…

A D3 map

This interactive visualization shows migrant deaths and disappearances worldwide, combining a geographic bubble map with a temporal histogram. A D3 natural Earth projection renders the world map, with semi-transparent circles sized by death counts using a square root scale. The histogram below aggregates monthly totals, and both views share the same dataset of recorded incidents. The visualization is built with React, D3 v4 geo and scale utilities, and SVG rendering, using data from the Missing Migrants Project.

Mmaavwin6

87% match

Loading thumbnail…

test

An interactive visualization combines a bubble map with a date histogram to explore global migrant deaths. The map uses a natural Earth projection for country boundaries and graticules, with circle radii scaled to the square root of the death count. The histogram bins reported deaths by month, and a brush filter on the histogram updates the map’s displayed data, revealing temporal patterns. Data comes from the Missing Migrants Project CSV, while country shapes are derived from the world-atlas TopoJSON. The implementation leverages D3 v5 for projections, scaling, and brushing, all within a React component rendering SVG.

AAmir

86% match

Loading thumbnail…

Missing Migrants Multiple Views

This interactive visualization presents missing migrant incidents on a world map with proportional bubbles, alongside a time-series histogram of monthly deaths. The React-based interface renders geographic data using `d3.geoNaturalEarth1`, `d3.geoPath`, and `d3.geoGraticule`, with bubble sizes scaled via `d3.scaleSqrt`. The histogram bins reported dates by month using `d3.histogram` and `d3.timeMonths`. Both views display data from a CSV of Missing Migrants Project records, loaded with `d3.csv` and overlaid on a World Atlas TopoJSON basemap.

Jjwlam83

86% match

Loading thumbnail…

Multiple Views

This interactive visualization combines a geographic bubble map with a time-series histogram to explore migrant deaths and disappearances. The map displays circles sized by the total dead and missing count using a square-root scale, with an equal Earth projection rendered via `d3.geoPath`. The histogram bins reported dates by month using `d3.bin` and `d3.timeMonths`, with a brush (`d3.brushX`) that filters the map’s data in real time. Both views are built with React and D3 v7, using data from the Missing Migrants Project.

JJosh Zalcman

86% match