Skip to main content
SimilarExport ZIP
100%

CS360 FINAL PROJECT Bar Chart Darren Dunn

✓ Published0🌍 Public
Ddarrenisdunn
Last edited May 1, 2022
Created on Apr 18, 2022
Forked from HTML Starter

This bar chart displays the average monthly passenger counts for airlines operating out of San Francisco in 2021, sorted vertically by airline name. The visualization uses d3.scaleBand for the categorical y-axis and d3.scaleLinear for the numeric x-axis, rendering horizontal bars as SVG rectangles. Data is loaded asynchronously via d3.tsv from a remote GitHub gist, with axis labels and tick marks generated using d3.axisBottom and d3.axisLeft. Bar color is a uniform dark teal, and the chart includes rotated x-axis labels for readability.

AI-generated description

CS360 Final Project Vertical Bar Chart

Darren Dunn

MIT Licensed

Similar vizzes

Loading thumbnail…

CS 360 Final Project |ALPHA RELEASE| Bar Chart

This bar chart visualizes average passenger counts for airlines at San Francisco International Airport (SFO) in 2021, using data loaded from a TSV file. It displays categorical airline names on the x-axis and numeric passenger averages on the y-axis, with bars colored via a linear blue scale. The visualization is built with D3 v4, utilizing `d3.scaleBand` for the x-axis, `d3.scaleLinear` for the y-axis, and `d3.axisBottom` and `d3.axisLeft` for tick labels. Bars are drawn as SVG rectangles, with colors mapped using `d3.schemeBlues`. The chart includes custom axis titles and a title, all within an SVG canvas.

Ddarrenisdunn
91% match
Loading thumbnail…

CS360 FINAL PROJECT Line Chart Darren Dunn

This chart shows a line graph comparing the monthly average passenger counts for United and American Airlines at SFO from January through June 2021. The visualization uses D3.js v4 to render an SVG, reading data from a TSV file. The code groups the data by airline using a `d3.nest` key function, then draws a separate colored path for each carrier with `d3.line`, scaled by a linear `d3.scaleLinear` for both the month (x-axis) and passenger count (y-axis). The final chart color palette maps airline names to blue and light blue.

Ddarrenisdunn
87% match
Loading thumbnail…

CS360 FINAL PROJECT Tree Map Darren Dunn

This tree map visualizes the average passenger count (APC) for airlines departing from San Francisco International Airport, using data from `sfo_data.csv`. It displays each airline as a colored rectangle sized proportionally to its APC value, with the airline’s IATA code (e.g., UA, AS) labeled inside its cell. The visualization is built with D3 v4, using the `d3.stratify` and `d3.treemap` APIs to compute the hierarchical layout and render the rectangles as SVG elements, with all values sourced directly from the CSV file.

Ddarrenisdunn
82% match
Loading thumbnail…

CS 360 Final Project |ALPHA RELEASE| Scatter Plot

This scatter plot shows the average passenger count at SFO across six months of 2005, with the x-axis representing months 7 through 12 and the y-axis showing passenger counts up to 30,000. The visualization loads data from a tab-separated file using d3.tsv and renders circles with d3.scaleLinear axes and SVG elements. The chart uses D3 v4 to append a titled SVG with labeled axes, plotting each month as a blue dot filled via the style attribute.

Ddarrenisdunn
82% match
Loading thumbnail…

Bar Chart

This bar chart visualizes passenger volumes by region for San Francisco Airport, showing that the US dominates with over 487 million passengers, followed by Asia and Europe. Built with D3 v5 and SVG, the visualization uses `d3.scaleBand` for the categorical x-axis and `d3.scaleLinear` for the continuous y-axis, with data loaded from a CSV file via `d3.csv`. The chart features purple bars that turn brown on hover, with axis labels applied through `d3.axisBottom` and `d3.axisLeft`.

Pphemmati
81% match
Loading thumbnail…

Fork of CS 360 Final Project |ALPHA RELEASE| Scatter Plot

A scatter plot displays the average passenger count at SFO for each month from July through December 2005. The visualization uses circles positioned along a linear x-axis for months and a y-axis ranging from 0 to 30,000 passengers, with each point labeled by its month and average count. The code loads data from a tab-separated file using `d3.tsv`, and builds the chart with d3.v4, appending SVG elements and using `d3.axisBottom` and `d3.axisLeft` for the axes.

Ddarrenisdunn
81% match
Loading thumbnail…

Fork of CS 360 Final Project |ALPHA RELEASE| Scatter Plot

A scatter plot displays the average passenger count at SFO for each month from July through December 2005. The visualization uses circles positioned along a linear x-axis for months and a y-axis ranging from 0 to 30,000 passengers, with each point labeled by its month and average count. The code loads data from a tab-separated file using `d3.tsv`, and builds the chart with d3.v4, appending SVG elements and using `d3.axisBottom` and `d3.axisLeft` for the axes.

Ddarrenisdunn
81% match
Loading thumbnail…

Fork of CS360 FINAL PROJECT Tree Map T1 Darren Dunn

This treemap visualizes the number of arriving passenger counts (APC) for international airlines at San Francisco International Airport, using data loaded from a CSV file. The hierarchy is built with `d3.stratify`, with airline names as leaf nodes under a single "Origin" parent, and rectangle sizes are computed via `d3.treemap`. Each leaf is rendered as an SVG `<rect>` filled with dark teal and labeled with the airline name using white SVG text. The visualization uses D3 v4 and renders a static, 1500-by-1500-pixel SVG layout with black strokes around each cell.

Ddarrenisdunn
79% match