Miles per Gallon vs Horsepower

100%

Miles per Gallon vs Horsepower

✓ Published0🌍 Public

Last edited Mar 20, 2024

Created on Mar 19, 2024

This scatter plot visualizes the relationship between miles per gallon and horsepower for 32 car models, revealing a clear negative correlation. The visualization uses D3.js v7 with SVG rendering, scaling data from the mtcars dataset via a CSV file. The code employs `d3.csv` for data loading, `scaleLinear` for both axes, and `axisLeft` and `axisBottom` for ticks. Circles are positioned using the computed scales, with axis labels added to clarify the quantitative values shown.

AI-generated description

Scatter plot

MIT Licensed

Similar vizzes

Loading thumbnail…

Scatterplot: Horsepower and MPG in D3

This scatterplot shows the relationship between horsepower and miles per gallon (MPG) for a set of cars. It displays each car as a circle, with MPG on the x-axis and horsepower on the y-axis. Using d3.csv, it loads car data from a remote GitHub gist, converts the string values to numbers, and maps them to linear scales via d3.scaleLinear. The visualization renders circles as SVG elements, styled with CSS hover effects, and includes labeled axes and a title generated with d3-axis and SVG text.

Kkfhujosefsson@dons.usfca.edu

87% match

Loading thumbnail…

Cars Scatter Plot

This scatter plot visualizes the relationship between miles per gallon (MPG) and horsepower for a dataset of cars, with each circle representing a vehicle. The chart uses color to differentiate individual data points, while axes are labeled and scaled using D3's `scaleLinear` and `scaleBand` functions. Built with D3 v5, the visualization renders as an SVG and reads its data from an external CSV file. The code employs D3's `axisLeft`, `axisBottom`, `extent`, and `format` APIs to construct the axes and tick marks.

EEdward-Elric233

86% match

Loading thumbnail…

Cars Scatter plot

This scatter plot visualizes the relationship between horsepower and miles per gallon for car models, with each circle representing a vehicle. The axes are labeled and the chart includes a title. The visualization uses d3.scaleLinear to map data values to screen coordinates, d3.axisBottom and d3.axisLeft for tick marks, and SVG circles with steelblue fill and opacity. Data is loaded asynchronously from a CSV file using d3.csv.

PPeter S

85% match

Loading thumbnail…

Scatter Plot

This interactive scatter plot visualizes the relationship between miles per gallon and horsepower for cars from the auto-mpg dataset, with each red semi-transparent circle representing a vehicle. The chart uses d3.scaleLinear to map data values to pixel coordinates, d3.axisBottom and d3.axisLeft to render labeled axes with gridlines, and SVG circles for marks. Data is loaded via d3.csv, with circles and labels appended through D3 selections, while axis tick styling is handled in the linked stylesheet.

ZZY Huang

85% match

Loading thumbnail…

Scatter plot

This scatter plot visualizes the relationship between horsepower and miles per gallon for various car models, sourced from the auto-mpg dataset. The D3 v6 code loads CSV data, maps horsepower to the x-axis and mpg to the y-axis using linear scales, and renders semi-transparent pink circles for each car. Axis tick marks extend across the plot, and both axes are labeled. The SVG output includes a title and uses Roboto Mono typography for all text elements.

RRodolfo Viana

85% match

Loading thumbnail…

Scatter Plot

This scatter plot displays the relationship between miles per gallon and horsepower for various car models, with each point representing a vehicle. The visualization uses D3.js v6 within a React framework to scale and position circles on an SVG canvas. The code employs `scaleLinear`, `axisLeft`, and `axisBottom` to construct axes and plot the data, which is loaded from a CSV file. The visualization also includes axis labels, a title, and a semi-transparent steelblue fill for the circles.

Nnsadath

85% match

Loading thumbnail…

Cars Scatter Plot

This scatter plot visualizes the relationship between miles per gallon and horsepower for a dataset of cars, with each point representing a vehicle. The axes are labeled as "Population" and "Weight" despite plotting mpg and horsepower. Built with D3 v5, the visualization uses `scaleLinear`, `axisLeft`, and `axisBottom` to render the chart as an SVG. Data is loaded asynchronously from a CSV file using D3's `csv` method, and circles are appended to the SVG to represent data points.

AAngus Hon

85% match

Loading thumbnail…

horsepower legend

This scatter plot visualizes the relationship between miles per gallon (mpg) and horsepower for various car models, with points colored by their country of origin. The visualization uses the Vega-Lite API, built on Vega and D3, to render an interactive SVG chart. Data comes from the UCI Machine Learning Repository's Auto MPG dataset. Tooltips display additional attributes like weight when hovering over individual data points. The chart is configured with custom axis styling and a dark color scheme for improved readability.

EEnes Gök

84% match