Fork of A7: Line Chart

100%

Fork of A7: Line Chart

✓ Published1🌍 Public

Ddale@benchmarking.com.au

Last edited Aug 15, 2025

Created on Aug 15, 2025

This multi-line chart shows the average horsepower of cars from Audi, BMW, Toyota, and Ford between 2010 and the latest available year in the dataset. It uses d3.csv to load car data from a GitHub gist, d3.rollup to group and average values by year and manufacturer, and d3.scaleLinear with d3.line to draw the series. A legend is rendered using the d3-legend plugin, while d3.axisBottom and d3.axisLeft display the time and horsepower scales on an SVG canvas.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Fork of Fork of A7: Line Chart

This multi-line chart displays average horsepower trends from 2010 onward for four car brands—Audi, BMW, Toyota, and Ford—using data from a CSV file. The visualization uses D3 v6 with an SVG rendering approach, applying `d3.rollup` to compute yearly averages per make and `d3.line` to draw the paths. It incorporates a categorical color scale via `d3.scaleOrdinal` and a legend generated by the d3-legend plugin. Axes are built with `d3.axisBottom` and `d3.axisLeft`, and missing data values are handled using the line generator’s `.defined` method.

Yyunxiaqian@gatech.edu

94% match

Loading thumbnail…

Fork of Fork of A7: Line Chart

This multi-line chart tracks average engine horsepower from 2010 onward for Audi, BMW, Toyota, and Ford, using data from a cars CSV file. The visualization filters the dataset to these four manufacturers and aggregates values by year, drawing one colored line per brand. Built with D3.js v6, it uses `d3.rollup` to compute group means, `d3.line` for path generation, and the `d3-legend` plugin to render a color legend in an SVG canvas. Missing data points are handled with null gaps in the line stroke.

RRITESH S

94% match

Loading thumbnail…

A7: Line Chart

This multi-line chart visualizes average horsepower by year for Audi, BMW, Toyota, and Ford, using data from a CSV file loaded via `d3.csv`. Each car brand appears as a distinct colored line, with a legend generated using `d3.legendColor`. The chart aggregates values with `d3.rollup` and `d3.mean`, then renders line paths using `d3.line` on a linear scale axis, filtering to years from 2010 onward.

SSukhraj Singh

91% match

Loading thumbnail…

A5-Line Chart

This line chart displays the average horsepower of cars over time, with each point representing the mean value for a given year. The data is loaded from a CSV file hosted on GitHub Gist using `d3.csv`. The visualization uses D3 v6's `scaleLinear` for both axes, applies a monotone curve to smooth the line, and renders the chart as an SVG. Axis labels and a title are added with standard D3 axis functions.

SSukhraj Singh

82% match

Loading thumbnail…

A7- Heatmap

This heatmap visualizes average engine horsepower across model years for the top five car manufacturers in a dataset loaded via d3.csv. The x-axis shows the year, the y-axis lists manufacturers, and each cell is colored using d3.scaleThreshold with explicit horsepower bins. Interactivity comes through a custom tooltip that appears on mouseover, while a manually constructed legend displays the color ranges. The chart is rendered as SVG using d3.scaleBand for the axes.

SSukhraj Singh

80% match

Loading thumbnail…

Fork of Bar chart with a Sequential color scale

This bar chart displays the average horsepower for seven car brands, sorted from lowest to highest, with each bar colored according to a sequential red color scale that encodes the horsepower value. The visualization loads data from a CSV file using d3.csv, binds it to SVG rectangles, and uses d3.scaleBand, d3.scaleLinear, and d3.scaleQuantize for positioning and color mapping. Interactive tooltips appear on mouseover, while d3.legendColor adds a legend, and axes are rendered with d3.axisBottom and d3.axisLeft.

SShishiraRudrabhatla

80% match

Loading thumbnail…

Fork of D3 Starter - line chart

This line chart visualizes the relationship between horsepower and miles per gallon (MPG) for a dataset of cars, revealing the general trend of decreasing fuel efficiency as engine power increases. Sorted by horsepower, the data is plotted as a single smooth line using D3's `d3.line` generator, with scales defined by `d3.scaleLinear` and axes rendered via `d3.axisBottom` and `d3.axisLeft`. The CSV data is loaded asynchronously from a GitHub repository and drawn as an SVG within a styled container. The chart includes labeled axes for horsepower and MPG, with the line styled in a teal color.

Ssowjanya

79% match

Loading thumbnail…

Fork of Bar chart with a Sequential color scale New

This bar chart displays the average horsepower for seven car brands, sorted in ascending order and colored with a sequential red scale that maps horsepower values to color intensity. Built with D3 v6, the visualization uses `d3.scaleBand`, `d3.scaleLinear`, and `d3.scaleQuantize` to position and color the bars, while a tooltip appears on mouseover. The rendering is SVG-based, with axes, a color legend, and animation effects, drawing data from a CSV file named `barchart.csv`.

Pprateek

79% match