Voronoi Arc Map

100%

Voronoi Arc Map

✓ Published0🌍 Public

Last edited Jul 10, 2016

Created on Nov 22, 2013

A Voronoi arc map displays flight routes between US airports overlaid on a geographic map. Each airport is assigned a Voronoi cell, and hovering over a cell highlights all flight arcs originating from that airport in red. The visualization uses D3 v4 with `d3.geoPath`, `d3.geoAlbers`, and `d3.voronoi`, rendering SVG elements. Flight data comes from airports.csv and flights.csv, with the map drawn from TopoJSON data.

AI-generated description

Hover to see flight routes associated with each airport. The interaction does not require JavaScript event handlers: it’s done using the CSS :hover state!

gpl-3.0 Licensed

Similar vizzes

Loading thumbnail…

U.S. Airports Voronoi

A Voronoi diagram partitions the United States into red cells, each containing the nearest airport from a dataset of 1,200+ airports. The map first draws land and state boundaries using TopoJSON and `d3.geoPath`, then projects airport coordinates with a `d3.geoAlbers` projection. Finally, `d3.voronoi` computes and renders the cell polygons, clipped to the SVG canvas, with airports shown as small points.

Mmbostock

86% match

Loading thumbnail…

An interactive D3 map

An interactive D3 map visualizes U.S. airports and their flight routes, with arcs connecting a central hub to various destinations and animated circles marking each airport’s location. The map also displays country boundaries and a Voronoi diagram around airport cells, with hover tooltips revealing flight counts. Using d3.geoPath and geoAlbers projection, it renders SVG shapes from TopoJSON world data and CSV files, with circles animating via transition delays and ease functions.

Iinroadings

82% match

Loading thumbnail…

World Airports Voronoi recreated

A world map rendered as an orthographic projection shows Voronoi cells computed from airport locations, with each cell colored distinctly and linked by dashed lines between neighboring airports. The visualization recreates Jason Davies’s classic demo using d3.geoVoronoi to generate the polygons and links from a CSV of airport coordinates, while d3.geoPath projects the spherical geometry. Country outlines from a TopoJSON file appear beneath the cells, and the sphere is shaded with a radial gradient for a three-dimensional effect.

PPhilippe Rivière

81% match

Loading thumbnail…

An interactive D3 map

This interactive map uses d3.geoPath and a geoAlbers projection to render a world map with animated circles marking airports. The visualization connects airports via arcs based on route data from routes.csv, and uses a Voronoi diagram overlay to partition the map. The animation uses d3 transitions with easing, while data is loaded from the d3.json, d3.csv, and world-atlas package.

Iinroadings

78% match

Loading thumbnail…

Flight Paths using Edge Bundling

This visualization shows flight paths between US airports using edge bundling, with a basemap of the continental United States rendered as projected SVG paths. Airport positions are marked with scaled circles, and a Voronoi diagram enables interactive highlighting of individual airports. The code uses d3.json, d3.csv, and Promise.all to load topojson map data and CSV flight/airport datasets, then filters and sorts the data to display the top 50 airports. d3.geoPath, d3.geoAlbers, and d3.scaleSqrt are used for map projection, path generation, and bubble sizing.

HHassan Abdullah

75% match

Loading thumbnail…

Gist efb1c9f3f0a9092c420dfe4cef8def96

This visualization displays a map of US airports, using a data-driven approach to plot the locations of each airport across the country. It shows the geographic distribution of airports using an Albers USA projection, with the map boundaries rendered as a shaded path. The code relies on the D3.js library, specifically `d3.geoAlbersUsa`, `d3.geoPath`, and `d3.json` for loading the TopoJSON map data and JSON airport coordinates. The final output is an SVG image, generated from these fetched datasets and projected onto a 960 by 500 pixel canvas.

PPhilippe Rivière

74% match

Loading thumbnail…

Major U.S. Destination Airports

This visualization maps major U.S. destination airports using a conic conformal projection rendered with d3.geoPath. Each flight destination appears as a semi-transparent red circle, with overlapping points creating darker regions that indicate higher flight density. State boundaries come from the U.S. Atlas TopoJSON, while flight data is loaded from a CSV containing latitude and longitude coordinates. The React application uses d3.geoAlbers with fitExtent to scale the map, and includes graticules and a sphere outline for geographic context.

JJosvin John

73% match

Loading thumbnail…

An interactive D3 map

This interactive map visualizes a world map with airports and flight routes, highlighting connections from Bozeman (BZN) to major hubs. It uses d3.geoPath with a geoAlbers projection to render country boundaries, airport points, and Voronoi cells. Airports bounce into view with d3 transitions, while flight arcs are drawn as MultiLineStrings. Data comes from CSV files and the world-atlas TopoJSON, with svg elements and animation for interactivity.

AAlan McConchie

72% match