Interactable time table

100%

Interactable time table

✓ Published0🌍 Public

Last edited Jan 13, 2020

Created on Jan 13, 2020

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.

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 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

92% match

Loading thumbnail…

Interactable time table

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.

Jjsong

91% match

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

90% match

Loading thumbnail…

Interactive Migrant Map

A world map with semi-transparent circles plots locations of missing migrants, sized by the square-root-scaled count of dead and missing individuals. A time-series histogram below aggregates the same data by month, using `d3.bin` and `d3.timeMonths` to compute totals. React composes the two views, while `d3.geoNaturalEarth1` and `d3.geoPath` render the graticule, land, and country interiors from TopoJSON. Both charts are drawn as SVG, with circles and bars colored in teal against a light gray basemap.

KKtuzinowski

86% match

Loading thumbnail…

Missing Migrants on a Map with Time

This interactive visualization combines a world map with a time-series histogram to explore the Missing Migrants Dataset. The map uses d3.geoNaturalEarth1 and d3.geoPath to render country boundaries, with circles sized by d3.scaleSqrt according to the total dead and missing per event. A linked date histogram below aggregates monthly totals, using d3.bin and d3.scaleTime. The React components manage state and rendering, with tooltips provided by SVG title elements. Data comes from a CSV of reported incidents, and world geography uses TopoJSON from the world-atlas package.

AAlex Stulov

85% match

Loading thumbnail…

Optimizing with React

A world map displays the global distribution of missing migrants, with circle size encoding the total number dead or missing for each location. A time-series histogram below the map shows the monthly count of missing migrants, and brushing on this histogram filters the map’s circles to the selected date range. The visualization uses React for component structure, D3's `geoNaturalEarth1` projection and `geoPath` for map rendering, `scaleSqrt` for circle sizing, and a D3 `brushX` to control filtering. Data comes from the Missing Migrants Project CSV, with country boundaries from World Atlas TopoJSON.

Ddaneslutzky

83% match

Loading thumbnail…

Missing Migrant Part IV

A world map visualization displays the number of dead and missing migrants by location, with circle size proportional to the total count. A second panel shows a time histogram of the same totals aggregated by month. The project uses React for the interface, D3’s geoNaturalEarth1 projection and geoPath for the map, and scaleSqrt for sizing circles. Data comes from the Missing Migrant Project CSV.

Aadewole-top

83% match

Loading thumbnail…

Missing Migrants on a Map with Fast Brushing Bars (V1)

A world map uses semi-transparent circles to show the geographic distribution of missing migrants, with circle size encoding the total number dead or missing per location. A brushed time-series histogram below the map filters the displayed circles to a selected date range, updating the map dynamically. The visualization is built with React and D3 v5, using `geoNaturalEarth1` and `geoPath` for the map projection, `scaleSqrt` for circle sizing, and `brushX` for the interactive time filter. Data comes from a CSV of migrant incidents sourced from Simplemaps.

AAndre J Denais

83% match