Fork of world map

Fork of World Map migrants

This visualization displays a world map with semi-transparent circles marking locations of missing migrants, sized proportionally to the total number of dead and missing individuals. Using React, d3.geoNaturalEarth1, and d3.geoPath, it renders land boundaries, interiors, graticules, and a sphere. Circle radii are scaled with d3.scaleSqrt based on data from a CSV dataset, which is loaded via d3.csv and combined with World Atlas TopoJSON for geographic features.

Mmarianamartins87

85% match

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.

85% 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`.

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.

Fork of Polished World Map

This fork of a polished world map visualizes global city populations using a natural Earth projection. The visualization displays landmasses, country interiors, graticules, and a sphere outline, with city markers sized proportionally to population using a square root scale. It loads TopoJSON country boundaries from the world-atlas package and city data from a CSV file, processing them with d3's geoNaturalEarth1, geoPath, and geoGraticule utilities. The React rendering uses SVG paths and circles, styled with custom CSS classes for a clean, refined aesthetic.

Jjchen6912

Fork of Fork of Polished World Map

This example presents a global map of missing migrants, using circles sized by the total number of dead and missing per location. The visualization renders geographic features with `d3.geoNaturalEarth1` and `d3.geoPath`, including graticules, landmasses, and country borders, while proportional circles are drawn over the projected coordinates. The code combines React with D3 v5, loading world atlas TopoJSON data and a CSV of migrant incidents, then scales circle radii using `scaleSqrt`. The map is rendered as SVG with a natural Earth projection, highlighting spatial patterns in the data.

Mmikekslv

Fork of Fork of Fork of V3 Immigrants flow map between countries

This interactive map visualizes global immigration flows to and from selected countries using edge-bundled lines rendered with SVG. Clicking a country highlights it in red and filters the displayed migration paths to only that origin country, with line opacity and width encoding the 2020 immigrant counts. The visualization uses d3.geoNaturalEarth1 and d3.geoPath for the world map, d3.ForceEdgeBundling for bundling the flow lines, and d3.scaleSequential with d3.interpolateBlues for color encoding. Data comes from CSV files loaded via d3.csv, with country coordinates matched from a supplementary coordinate dataset.

82% match