Flight Map

Flight Map

This visualization displays flight routes between continents on a world map, with the thickness of each line representing the volume of traffic for a selected month. A slider allows viewers to cycle through twelve months of data, which is stored in CSV files. The d3.geoMercator projection and d3.geoPath are used to render the map and the great-circle paths linking regions, while a transition animation (d3.transition) updates the view. Hovering over a route reveals its exact numeric value in a tooltip.

Iimsohandsome123

88% match

Fork of Flight Map

This visualization presents a world map with animated flight paths between continents, using a Mercator projection created with `d3.geoMercator()`. The map is rendered as SVG paths via `d3.geoPath()`, with each intercontinental link colored differently and its stroke width proportional to monthly passenger counts. A slider allows users to select a month (1–12), updating the path widths accordingly from CSV data files. Hovering over a path reveals its exact value via a tooltip, and the map itself uses `d3.json()` to load world GeoJSON data. The code relies on D3 v4 APIs including `d3.select`, `d3.transition`, and `d3.event` for interaction, with styling applied through CSS.

RRudi Poepsel Lemaitre

85% match

Project

This interactive dashboard visualizes Taiwanese outbound traveler flows by country and month, using animated bar charts to show passenger volumes for specific airports or seaports. Users filter by year, transport mode (airplane or ship), and individual countries across continents, with a month slider and sorting options for distance or quantity. Built with React and D3.js, the project renders SVG bar charts that update dynamically, pulling data from a CSV file containing annual and monthly travel statistics for destinations across Asia, the Americas, Europe, and Oceania. The interface also provides a slider to scrub through months and a dropdown to sort results, enabling comparative analysis of travel patterns over time.

TTimmyLu

77% 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.

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.

Fork of of V6 Immigrants flow map between countries

This interactive map visualizes global immigration flows to and from selected countries in 2020. Clicking a highlighted country filters and displays bundled migration paths, rendered as curved lines, from that origin to destinations worldwide, with a bar chart below ranking the top 20 destination countries by immigrant count. The visualization uses React with D3 v5, employing `d3.geoNaturalEarth1` and `d3.geoPath` for the map, `d3.ForceEdgeBundling` for flow aggregation, and `d3.scaleBand` with `d3.scaleSqrt` for the bar chart, drawing data from a CSV file.

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

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.