Immigrants flow map between countries

V1 Immigrants flow map between countries

This interactive map visualizes global migration flows for the year 2020, showing curved lines between countries that represent immigrant origins and destinations. Users click on a country to isolate and display only the flows originating from that nation. The visualization uses D3’s `geoNaturalEarth1` projection, `geoPath` for rendering the world map and graticules, and React for handling user interactions. Geographic coordinates are derived from a CSV file, while migration counts come from a separate dataset; the map itself is built from topojson data converted to GeoJSON.

91% match

V3 Immigrants flow map between countries

This interactive map visualizes global immigrant flows between countries for 2020, based on UN migration data. Clicking a country highlights its origin by turning it red and draws curved flow lines to its destinations, with stroke color encoding the number of immigrants via a sequential blue-purple color scale. The visualization uses d3.geoNaturalEarth1 projection and d3.geoPath to render world map features, while React manages the selection state and d3.zoom enables pan and zoom interactions.

91% match

Fork of V2 Immigrants flow map between countries

This interactive map visualizes immigrant flows between countries, showing curved paths from origin to destination for the year 2020. Clicking a country highlights it in red and displays only the migration lines associated with that selected country. The visualization uses React hooks for state management and data fetching, with D3’s `geoNaturalEarth1` projection and `geoPath` for rendering the world map and flow lines as SVG paths. Coordinates come from a local CSV, migration data from a Gist, and country boundaries from a TopoJSON world-atlas file.

of V6 Immigrants flow map between countries

This interactive map visualizes immigrant flows between countries, with each line representing migration from an origin to a destination country. Clicking a country highlights it in red and filters the visualization to show only its incoming migration flows, while all other flows remain hidden. The map uses a natural Earth projection via `geoNaturalEarth1` and `geoPath`, with curved lines generated by `d3.ForceEdgeBundling` to reduce visual clutter. The data comes from CSV files loaded with `d3.csv`, and the interface is built with React, allowing users to zoom and pan the SVG-based visualization.

Fork of Fork of V3 Immigrants flow map between countries

This interactive map visualizes immigrant flows between countries in 2020, rendering a natural Earth projection with country boundaries and curved arcs that represent migration volumes using stroke width and color intensity. Users can click any country to filter and highlight its emigration patterns, with selected regions shown in red and corresponding flow paths displayed in blue. The visualization uses React hooks for state management, d3.geoNaturalEarth1 and d3.geoPath for map rendering, d3.forceSimulation with curveBundle for edge bundling of flow paths, and d3.scaleSequential with interpolateBlues to encode migration numbers. Data comes from CSV files containing migration statistics and country coordinates, with zooming enabled via d3.zoom.

V4 Immigrants flow map between countries

This map visualizes immigrant flows between countries in 2020 using an interactive world map. Users can click a country to highlight it as the origin and display bundled curved paths projecting to all destination nations, with stroke opacity indicating connection strength. The visualization uses D3 v5's `geoNaturalEarth1` and `geoPath` for map rendering, `d3.ForceEdgeBundling` for curve grouping, and a `scaleSequential` color scale based on migration numbers. Country boundaries derive from TopoJSON world-atlas data, while migration statistics come from a CSV gist.

World Immigrants

A world map displays immigrant flows between countries, with colored lines connecting origin and destination coordinates based on 2020 migration data. Clicking a country highlights it and filters the visualization to show only flows to that nation, while a horizontal bar chart at the bottom ranks the top ten destinations by immigrant count. The visualization uses React, D3 v5 APIs including `d3.geoNaturalEarth1`, `d3.geoPath`, `scaleBand`, and `scaleSqrt`, along with `d3.ForceEdgeBundling` for line bundling. Data is loaded from CSV files via D3's `csv` method, with zooming enabled through `d3.zoom`.

88% match

Fork of Fork of Fork of of V6 Immigrants flow map between countries

This interactive map visualizes global immigrant flows to a selected country, displaying both origin-destination paths and a bar chart of top destination regions. Clicking a country or highlighted point filters the flow lines and bars accordingly. Built with React and D3 v5, it uses `geoNaturalEarth1` projection and `geoPath` for the world map, while flow paths are generated through force-directed edge bundling via `d3.ForceEdgeBundling`. Immigrant data comes from a CSV file, with coordinates matched by country name, and zooming is implemented using `d3.zoom`.