Skip to main content
SimilarExport ZIP
100%

Fork of Q2

✓ Published0🌍 Public
LLakshmiPrasannaValdas@my.unt.edu
Last edited Apr 26, 2024
Created on Apr 26, 2024
Forked from Q2

A network-style comparison of airline delay proportions is shown as a multi-series area chart, with each colored band representing a delay category. The visualization uses D3 v6, loading data from a CSV file and rendering with SVG. The code applies `d3.area`, `d3.scaleBand`, and `d3.scaleLinear` to position the areas, with a legend mapped from `d3.schemeCategory10`. Axes are labeled for airlines and delay proportion, and the data is fetched asynchronously via `d3.csv`.

AI-generated description

An example showing the capabilities of VizHub:

  • Loads D3 via UNPKG.
  • Demonstrates use of import from "d3".
  • Demonstrates use of import from local ES6 modules.
MIT Licensed

Similar vizzes

Loading thumbnail…

Q2

This example shows the proportion of flight delays for different airlines, displayed as a series of overlapping filled areas. It loads CSV data from a GitHub gist and maps each delay category—such as carrier, weather, or national airspace—to a colored area using d3.area, positioned with d3.scaleBand on the x-axis and d3.scaleLinear on the y-axis. The chart includes axes with labels and a legend, all rendered as SVG via D3 v6.

LLakshmiPrasannaValdas@my.unt.edu
89% match
Loading thumbnail…

Fork of A7-Multi-Line Chart in D3

This multi-line chart displays monthly flight delay counts for four delay categories—carrier, late aircraft, national aviation system, and weather—across airports. It loads CSV data from a GitHub gist using `d3.csv`, then renders paths via `d3.line` with a `d3.scaleBand` x-axis and `d3.scaleLinear` y-axis. Color-coded lines and a manual legend distinguish categories, while axes are generated with `d3.axisBottom` and `d3.axisLeft`. The SVG output uses D3 v6 with the d3-legend library.

Ddale@benchmarking.com.au
79% match
Loading thumbnail…

Fork of Fork of Fork of Fork of Assignment 5: bubble plot with D3

This interactive dashboard visualizes airline delay patterns through four coordinated D3.js v7 charts: small multiples comparing late aircraft versus national aviation system delays across months, a time series of delay types, a stacked bar chart showing delay proportions by carrier, and a bar chart of average delay minutes. It includes year and carrier filters that update all views simultaneously, alongside tooltips and interactive legends. The visualization uses D3 scales, axes, stacking, and line generators with animated transitions on CSV data loaded from GitHub.

NNita
79% match
Loading thumbnail…

Fork of Assignment 5: line chart with D3

This interactive line chart visualizes monthly airline delay statistics from 2003 to 2016, comparing carrier delays, late aircraft delays, and national aviation system delays. Users can filter by year range and toggle delay categories, with hover tooltips and brush zooming for detailed exploration. Built with D3.js v7, the visualization uses d3.line, d3.axisBottom, d3.axisLeft, and d3.brush to render SVG paths, axes, and interactive selection. Data is loaded from a CSV file and processed as time-series values, with animated transitions when filters change.

NNita
78% match
Loading thumbnail…

Fork of Fork of Fork of Assignment 5: bubble plot with D3

This small multiples visualization shows how airline delays vary by month, displaying the correlation between late aircraft delays and National Aviation System delays for each month of the year. Each cell contains a bubble plot where carrier delays determine point size and airline carrier determines color, with trend lines and Pearson correlation coefficients revealing seasonal patterns. The visualization uses d3.csv to load airline delay data, d3.group and d3.scaleOrdinal for data organization and color encoding, and d3.axisBottom and d3.axisLeft for consistent axes across cells. Interactive tooltips appear on hover, while the layout is computed manually with a fixed cell size rather than using d3.layout functions.

NNita
78% match
Loading thumbnail…

Fork of Fork of Assignment 5: bubble plot with D3

This small multiples visualization displays airline delays across twelve months, plotting late aircraft delays against national aviation system delays for individual carriers. The bubble size encodes carrier delay counts, while color distinguishes airlines by name, with each monthly cell including a Pearson correlation coefficient with a trend line. The D3.js v7 implementation uses `d3.group` for data nesting, `d3.scaleOrdinal` and `d3.scaleSqrt` for color and size mapping, and `d3.axisBottom` and `d3.axisLeft` for tick marks. Hovering reveals detailed tooltips. Data comes from a CSV file hosted on GitHub, rendered as SVG with animated transitions.

NNita
77% match
Loading thumbnail…

Fork of Q2 Area chart

This area chart visualizes the count of items across categorical types, with each point plotted along a band scale and connected by a smooth area path. The data is parsed from a remote CSV file using `d3.csvParseRows`, and the visualization is rendered as an SVG via D3 v7. The chart uses `d3.scaleBand` for the x-axis, `d3.scaleLinear` for the y-axis, and a `d3.area` generator to draw the filled region. Axes are added with `d3.axisBottom` and `d3.axisLeft`, and axis labels are manually positioned for clarity.

Llokeshchowdary465@gmail.com
77% match
Loading thumbnail…

Fork of Fork of Assignment 5: bubble plot with D3

This bubble chart visualizes airline delay statistics, plotting late aircraft delays on the x-axis against National Aviation System delays on the y-axis. Circle size encodes carrier-related delays, while categorical color mapping distinguishes months using `d3.scaleOrdinal` with `d3.schemeCategory10`. Built with `d3.svg`, the chart uses `d3.scaleLinear`, `d3.scaleSqrt`, `d3.axisBottom`, and `d3.axisLeft`, loading CSV data from GitHub. The visualization includes tooltips and static rendering, with animation support provided by the VizHub V3 runtime environment.

NNita
77% match