A Cars scatter plot Graph by Davide.js

100%

A Cars scatter plot Graph by Davide.js

✓ Published1🌍 Public

Last edited Mar 23, 2020

Created on Mar 22, 2020

This scatter plot from the Auto MPG dataset visualizes the relationship between horsepower and weight for cars, with each point representing a vehicle. The visualization uses d3.csv to load data and d3.scaleLinear for both axes, with d3.axisBottom and d3.axisLeft rendering the gridlines and tick marks. Circles are appended as SVG elements with fill and opacity styling from the CSS. The chart includes axis labels and a title, all rendered using d3’s selection and data-join methods.

AI-generated description

Scatter plot with data taken from Auto MPG (original URL: http://mlr.cs.umass.edu/ml/datasets/Auto+MPG)

MIT Licensed

Similar vizzes

Loading thumbnail…

Cars scatter plot

This scatter plot displays the relationship between horsepower and weight for a dataset of cars, sourced from an auto-mpg CSV file. Each car is represented as a semi-transparent red circle, with its position determined by these two quantitative variables. The visualization uses D3 v5, specifically the `scaleLinear`, `axisBottom`, and `axisLeft` APIs to construct the axes and grid lines, while the SVG rendering is handled through the D3 `select` and `append` methods. Axis labels and a title are styled via CSS, and the data values are coerced to numeric types before being plotted.

Ddavidpiber

92% match

Loading thumbnail…

Cars scatter plot

This scatter plot displays the relationship between horsepower and weight for cars from the auto-mpg dataset. The visualization uses d3.scaleLinear to map the data to x and y axes, d3.axisBottom and d3.axisLeft to render the axes with gridlines, and SVG circles to represent each car. The title, axis labels, and tick styling are configured via CSS classes. Data is loaded asynchronously with d3.csv and parsed before being passed to the render function.

Kkestefon

92% match

Loading thumbnail…

Cars Scatter Plot

This scatter plot from the Auto MPG dataset shows the relationship between car horsepower and weight, with each red circle representing a car. The visualization uses D3 v5’s scaleLinear, axisBottom, and axisLeft to map the data onto an SVG canvas, with axes labeled and styled via CSS. Data is loaded asynchronously from a CSV file and parsed into numeric values before rendering.

CColby Ludwig

92% match

Loading thumbnail…

Cars Scatter Plot

This scatter plot visualizes the relationship between horsepower and weight for cars from the auto-mpg dataset, with each circle representing a vehicle. The visualization uses D3 v5 and renders to SVG, employing `d3.csv` for data loading and `d3.scaleLinear`, `d3.extent`, and `d3.axisLeft`/`d3.axisBottom` for scales and axes. Grid lines are drawn via tick sizes, and the chart includes labeled axes and a title.

RRafael Campos

92% match

Loading thumbnail…

Cars Scatter Plot

This scatter plot visualizes the relationship between horsepower and weight for a dataset of cars. The D3.js code (v5) loads auto-mpg data from a CSV file, parses the numeric columns, and renders circles with a semi-transparent steelblue fill. Axes are customized using D3’s `axisBottom` and `axisLeft`, which draw gridlines via negative tick sizes. Linear scales with `.nice()` set the plot’s domain and range, while SVG elements are managed through D3 selections and appended within a margined group.

Zztawil

92% match

Loading thumbnail…

Cars Scatter Plot

This scatter plot visualizes the relationship between horsepower and weight for cars from the auto-mpg dataset, with each point representing a vehicle. The chart uses D3 scales (scaleLinear), axes (axisBottom, axisLeft), and SVG circles to render the data. A dropdown menu, built with a custom d3 module, lists dataset columns but currently only logs selections to the console rather than updating the chart. The visualization includes labeled axes, grid lines, and a title, with styling applied via CSS classes.

BBKirst3

92% match

Loading thumbnail…

Cars Scatter Plot

This scatter plot visualizes the relationship between horsepower and weight for cars from the auto-mpg dataset, with each red circle representing a vehicle. The visualization uses d3.csv to load the data, d3.scaleLinear for both axes, and d3.axisBottom and d3.axisLeft to render the tick marks and labels. The SVG rendering includes axis labels, a title, and grid lines created by extending ticks across the plot area, with data points displayed at 10-pixel radius and 30% opacity.

JJuyeonee

92% match

Loading thumbnail…

Cars Scatter Plot

This scatter plot visualizes the relationship between horsepower and weight for cars from the auto-mpg dataset. The visualization uses D3.js v5 with SVG rendering and linear scales to map the data points, which are displayed as semi-transparent circles. The chart includes labeled axes, tick marks, and a title, with the y-axis rotated for readability. Data is loaded from a CSV file and parsed before being bound to the SVG circles.

TTsing

92% match