A7-4 Line Chart

100%

A7-4 Line Chart

✓ Published3🌍 Public

Jjrcuster@dons.usfca.edu

Last edited Mar 15, 2025

Created on Mar 15, 2025

This chart displays the relationship between weekly attendance and gross earnings for several Broadway shows, with each show represented as a separate colored line. The visualization uses D3.js v7 with an SVG rendering approach, and it applies a linear scale to both axes to plot the data points. A legend identifies the show categories using a categorical color scheme. The chart is built from a CSV data source containing show statistics, and the code leverages `d3.scaleLinear`, `d3.line`, `d3.group`, `d3.scaleOrdinal`, and `d3.legendColor` to construct the visual elements.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

A6-Scatter Plot w/ Color

This scatterplot displays weekly Broadway show attendance against gross earnings, with each point colored by show type (Play or Musical). The visualization uses D3 v7 to load CSV data, apply linear scales for both axes, and render SVG circles. A d3.legendColor legend distinguishes the two categories, while axis labels clarify the quantitative variables. The chart highlights correlations between audience size and revenue across different production genres.

Jjrcuster@dons.usfca.edu

87% match

Loading thumbnail…

A4 - Scatter Plot

This scatter plot displays weekly Broadway performance data from the `broadway_short.csv` file, charting gross earnings over time. Each circle’s horizontal position encodes the date, while its vertical position maps to the weekly gross revenue; the circle's radius scales with attendance. The visualization is rendered as an SVG using D3 v7, employing `d3.scaleBand` for the x-axis dates and `d3.scaleLinear` for both the y-axis (gross) and the radius scale (attendance). Axes are generated with `d3.axisBottom` and `d3.axisLeft`.

Jjrcuster@dons.usfca.edu

85% match

Loading thumbnail…

A6-Bar Graph w/ Color

This bar chart visualizes Broadway show gross earnings between 1990 and 1991, with each bar representing a weekly observation from the broadway_short.csv dataset. The bars use a sequential red color scale, mapping darker shades to higher gross values, with a d3.legendColor legend positioned at the right. The visualization is built using d3.v7, leveraging scaleBand for the x-axis (dates) and scaleLinear for the y-axis (attendance), rendering as SVG rectangles whose fill color is determined by the Statistics.Gross value.

Jjrcuster@dons.usfca.edu

83% match

Loading thumbnail…

Fork of A6-Bar Graph w/ Color

This bar chart displays weekly gross earnings for Broadway shows from 1990-1991, with bars colored by show name via a d3.scaleOrdinal legend. It uses d3.csv to load the dataset, then d3.scaleBand and d3.scaleLinear to map dates and earnings. Bars animate upward with transitions, and hover tooltips show show name, gross, attendance, and capacity. The SVG renders responsively with d3.axisBottom, d3.axisLeft, and grid lines, styled by standard CSS.

NNita

83% match

Loading thumbnail…

A4-Bar Graph

This example displays Broadway shows' weekly gross earnings over time, revealing the performance of shows like Miss Saigon and Tru. It uses an SVG bar chart where each bar represents a week, with the chart's height encoding the gross revenue. The code employs D3 version 7 to handle data parsing, scaling, and rendering, specifically using `d3.scaleBand` for the x-axis dates and `d3.scaleLinear` for the y-axis gross values. The data is loaded from a CSV file, and axes are created with `d3.axisBottom` and `d3.axisLeft`.

Jjrcuster@dons.usfca.edu

82% match

Loading thumbnail…

Strip Plot-A3

This is a strip plot visualizing Broadway show gross earnings and attendance. It uses D3.js version 7 to render circles in an SVG, with each circle's x-position determined by its date and y-position by its gross earnings. The circle radius maps to attendance figures using a linear scale. The chart includes axes labeled with dates and gross values, with data sourced from a `broadway_short.csv` file. The visualization makes it easy to compare earnings and attendance across different weeks.

Jjrcuster@dons.usfca.edu

82% match

Loading thumbnail…

Fork of Fork of A6-Bar Graph w/ Color

This visualization presents weekly Broadway gross earnings for shows from 1990–1991, initially as a bar chart where bar height encodes gross revenue. Users can switch among eight chart types through a dropdown menu. The code uses d3.csv to load data, d3.scaleBand and d3.scaleLinear for bar positioning, and d3.scaleOrdinal with d3.schemeCategory10 for color coding by show name. Hovering bars triggers a tooltip revealing details.

NNita

80% match

Loading thumbnail…

A7-Small Multiples

This visualization displays Broadway show attendance trends as small multiples, with each panel representing a distinct month of data. Each chart plots attendance over time as a colored line within its own axes grid. The code uses D3 v7 methods like `d3.group` to partition the data by month, `d3.scaleTime` and `d3.scaleLinear` for axes, and `d3.line` to generate the paths. Show names appear omitted, and labels are manually positioned with SVG `text` elements.

Jjrcuster@dons.usfca.edu

79% match