Skip to main content
SimilarExport ZIP
100%

Airports!

✓ Published1🌍 Public
Aala-wahibi
Last edited Mar 27, 2021
Created on Mar 3, 2020
Forked from HTML Starter

The visualization shows the number of flight routes per airline as a horizontal bar chart, ranked by route count. Hovering over a bar highlights that airline and displays its flight routes on a world map using `d3.geoNaturalEarth1` projection with `d3.geoPath` for geographic rendering. The map draws airport connections as lines based on route data from the CSV file, while the bar chart uses `d3.scaleBand` and `d3.scaleLinear` for axes. The map background is rendered from GeoJSON country boundaries.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Airports - Network

This example visualizes the flight route network for each airline from a CSV dataset, using a force-directed layout. Nodes represent individual airports, while lines depict the connections between them, colored in the airline’s signature maroon. The visualization is built with D3.js v5 and renders as an SVG. It employs `d3.forceSimulation` with `d3.forceLink`, `d3.forceManyBody`, and `d3.forceCenter` to position the nodes. The code also integrates `d3.ForceEdgeBundling` to bundle edges, reducing visual clutter in the dense network.

Aala-wahibi
82% match
Loading thumbnail…

airports

This bar chart displays airport data from a CSV file, listing airport codes along the y-axis and their population values along the x-axis. The visualization uses D3 v7 to load the data, create linear and band scales, and render axes using D3's axis functions. The chart is drawn with SVG elements, where each rectangular bar is filled with a steel-blue color, and the SVG canvas is set to 960 by 400 pixels. The code converts population strings to numbers before rendering the scaled bars.

YYi Changsheng
79% 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…

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
78% match
Loading thumbnail…

Untitled

The example is a dual-panel visualization of airline route data loaded from a `routes.csv` file. One SVG panel displays a sorted horizontal bar chart showing the number of routes per airline, with the bar for Air China highlighted in a distinct color. The other panel shows a geographic map of airports, with routes presumably drawn between them. The bar chart is built using D3 v6's selection, scale API (`d3.scaleLinear`, `d3.scaleBand`), and data-binding methods, while the map panel relies on similar SVG construction without using any geo-projection library.

DDasbach.EJ
77% match
Loading thumbnail…

NYC 2

This example visualizes airline routes in the New York City area, displaying a bar chart of route counts per airline alongside a map of airports. The page uses D3.js to load and parse the `routes.csv` data, aggregate routes by airline, and render the two SVG charts. The layout is styled with CSS flexbox, while the SVG elements are given a thin black border. The code is structured for the React framework but currently uses raw JavaScript within an HTML page.

DDasbach.EJ
77% match
Loading thumbnail…

airport distance

The visualization maps flight routes between airports, with lines sized and colored by distance, showing the global air travel network. It uses a WebGL-rendered globe or map to plot the paths, and the distance between airports is encoded by the length and opacity of each arc, with shorter routes appearing brighter and thicker. The visualization is built with D3 v3 and Vue, using both SVG and WebGL for rendering, and is based on airport data from OurAirports.

11wheel
76% match
Loading thumbnail…

Untitled

This visualization presents a map of US flight data, using a geospatial view to show airport locations and their connectivity. It displays two modes, “Busiest_Airports” and “All_Airports,” with interactive selections to explore different aspects of departures, arrivals, and delays. The map is rendered using D3 v3 with a `d3.geo.albersUsa` projection and `topojson` for state boundaries, while circles on the map represent individual airports. Additional bar charts and a custom legend (`d3.legend.js`) show delay statistics, and the visualization animates transitions when filters change. Data is sourced from RITA (Bureau of Transportation Statistics) for flights from 1987 to 2008.

Yyimingg7
76% match