Yearly Region-Wise Air Passenger Heatmap

100%

Yearly Region-Wise Air Passenger Heatmap

✓ Published0🌍 Public

Last edited Feb 19, 2020

Created on Feb 14, 2020

This heatmap visualization displays the total air passenger counts for various global regions across time, from 2005 to 2019. It aggregates the data by region and year, using a Viridis color scale to encode the passenger volumes. The visualization is rendered as an SVG graphic using D3.js v5, with axes for years and regions. It relies on D3’s scale functions and a nested data grouping API to structure the dataset, sourced from DataSF’s Air Traffic Passenger Statistics.

AI-generated description

This example visualize the Air Traffic Passenger Statistics dataset from DataSF(https://datasf.org/opendata/). The full citation is :

Data acquired from https://datasf.org/opendata/ on February 11 2020. Aggregated data on this page is made freely available under Open Data Commons Public Domain Dedication and License(https://opendatacommons.org/licenses/pddl/1.0/)

The direct link to data set is: https://data.sfgov.org/Transportation/Air-Traffic-Passenger-Statistics/rkru-6vcg

MIT Licensed

Similar vizzes

Loading thumbnail…

Monthly Passenger Count for Year 2019

This grouped bar chart shows monthly air passenger counts for 2019, split by domestic and international flights. The visualization uses d3.nest to aggregate the CSV data by date and geography, then renders two bars per month with d3.scaleBand and d3.scaleLinear. Axes are formatted with d3.axisBottom and d3.axisLeft, while a d3.scaleOrdinal color scale distinguishes the two categories. Data comes from DataSF’s Air Traffic Passenger Statistics dataset.

Mmab3105

75% match

Loading thumbnail…

Month wise travellers

The visualization displays monthly passenger numbers traveling to India from various airlines, using horizontal bars of varying lengths to represent passenger counts. Built with D3.js v6, the bar chart maps the `PASSENGERS_TO_INDIA` field from a CSV dataset, scaling each bar’s width proportionally via `d3.scaleLinear`. Rendered as SVG rectangles with a fixed height of 40 pixels, the chart orders airlines by row, enabling quick comparison of traffic volumes across carriers. The interactive chart loads data asynchronously via `d3.csv`, fetching the airline traffic dataset from a GitHub repository.

Jjs164

74% match

Loading thumbnail…

Flight Map

This interactive visualization shows the flow of travelers between five global regions across a 12-month period. The main map uses a Mercator projection with curved paths connecting regions, where stroke width represents the volume of travel, and hovering reveals exact numbers. A range slider allows selection of individual months. The visualization also includes a stacked area chart depicting time-series data for these regions. The code uses `d3.geoPath`, `d3.geoMercator`, `d3.scaleOrdinal`, and `d3.stack` within a React framework, rendering via SVG with animation.

Ttim310579

73% match

Loading thumbnail…

D3 Heatmap

This heatmap visualizes the number of Uber rides per month and year, with months on the x-axis, years on the y-axis, and color intensity encoding ride counts. It uses d3.csv to load the dataset, d3.scaleBand for both axes, and d3.scaleSequential with a color interpolator to map counts to cell colors. The SVG is rendered with d3.axisBottom and d3.axisLeft, while cells are drawn as rects. Data is aggregated client-side by parsing timestamps into month-year pairs.

DDominic Fernandez

71% match

Loading thumbnail…

Flights

This visualization, titled "Flights," presents monthly passenger traffic statistics for San Francisco International Airport, drawn from Datazar data spanning 2010 to early 2016. The dataset includes airline, route type (domestic/international), region, terminal, boarding area, and enplaned/deplaned passenger counts. Rendered as an SVG using D3 v4, the chart is built from scratch in D3 and visually encodes the passenger volumes per airline and region, with the author using Scott Murray's book as a reference for constructing the custom layout.

CCJKraenzle

71% match

Loading thumbnail…

Monthly Passenger Count for Year 2019

This grouped bar chart shows monthly passenger counts for domestic and international flights at San Francisco airport in 2019. The visualization uses d3.nest() to aggregate and group the CSV data by month and flight type, with d3.scaleBand for the x-axis and d3.scaleLinear for the y-axis. Bars are rendered as SVG rects with color encoding via d3.scaleOrdinal, and axes use d3.axisBottom and d3.axisLeft with custom time and count formatters. Data comes from DataSF’s Air Traffic Passenger Statistics dataset.

NNikhil Bhutani

71% match

Loading thumbnail…

Line Chart

This line chart shows the number of passengers using different airlines from 2005 to 2019, with each airline’s trend encoded by a distinct color. The vertical axis represents passenger counts, the horizontal axis indicates the year, and it includes both domestic and international flights. It uses d3.v4 with SVG rendering, where the `line()` generator creates the paths and `d3.scaleTime` maps the time data. The design includes axis labels, a legend to identify airlines, and smooth animated transitions via `transition.attrTween` to update the lines.

Pphemmati

70% match

Loading thumbnail…

Untitled

This visualization displays air traffic passenger statistics for San Francisco Airport from 2005 to 2019, using multi-series line charts to compare passenger volumes across airlines like Alaska and American. The code uses D3 v4 to create SVG-based line charts with scaling axes and path generation. Data is embedded directly in the script as JavaScript arrays. The visualization is styled with Bulma CSS for the header and navigation, with Font Awesome icons, and initializes the chart in a div element with the ID “chart.”

Pphemmati

70% match