Scatter plot

100%

✓ Published1🌍 Public

Last edited Sep 13, 2021

Created on Sep 12, 2021

Forked from Untitled

This scatter plot visualizes the relationship between miles per gallon and acceleration for a dataset of automobiles, with each car represented as a semi-transparent red circle. The visualization uses D3.js v7 to load the data via `d3.csv`, scale it with `scaleLinear`, and render axes using `axisLeft` and `axisBottom`. The SVG chart includes labeled axes and a title, with gridlines generated through tick size settings. Data comes from the World Population Prospects 2017 dataset, though the code actually loads an auto-mpg CSV from a VizHub URL.

AI-generated description

data:World Population Pro spects 2017.

MIT Licensed

Similar vizzes

Loading thumbnail…

Cars Scatter Plot

This scatter plot visualizes the relationship between miles-per-gallon (mpg) and acceleration for a dataset of cars, with each car represented as a semi-transparent dark red circle. The visualization loads data from a CSV file using D3’s `csv` method, then renders the plot with `scaleLinear`, `axisBottom`, and `axisLeft`. It includes grid lines, axis labels, and a title, all positioned within an SVG. The code uses D3 v5 and demonstrates data parsing, scaling, and axis configuration in a straightforward scatter plot layout.

Sshreeshb51

92% match

Loading thumbnail…

Cars Scatter plot with D3.js!

This scatter plot visualizes the relationship between acceleration and miles per gallon for cars from the auto-mpg dataset, with each circle representing a vehicle. Built with D3.js v5, the code uses `d3.csv` to load the data, `d3.scaleLinear` for both axes, and renders SVG circles with a fixed radius. The chart includes axis labels and grid lines generated via `d3.axisBottom` and `d3.axisLeft`, with circles styled in semi-transparent steelblue.

CCalvin Gomez

90% match

Loading thumbnail…

Cars Scatter Plot

This scatter plot shows the relationship between a car’s MPG and its acceleration using the auto-mpg dataset. Green, semi-transparent circles mark each car, with axis labels and tick marks revealing the distribution. The code uses d3.csv to load the data, d3.scaleLinear with d3.extent for scaling, and d3.axisLeft/axisBottom to render axes. SVG circles are appended via data joins, with axis lines removed and styled using CSS for a clean, readable layout.

RRod Potter

89% match

Loading thumbnail…

Cars Scatter Plot 2

This scatter plot visualizes the relationship between MPG and acceleration for cars from the UCI Machine Learning Repository’s Auto MPG data set. Each semi-transparent red circle represents a car, with position determined by linear scales mapping the data ranges to the SVG canvas. The chart includes labeled axes with grid lines, a title, and uses d3.csv for loading, d3.scaleLinear, d3.axisBottom, d3.axisLeft, and d3.extent for data processing and rendering in SVG.

OOvxOO

88% match

Loading thumbnail…

Car Scatter Plot

This scatter plot visualizes the relationship between fuel efficiency (MPG) and acceleration for a dataset of cars, with each vehicle represented as a translucent tomato-colored circle. The visualization uses D3 v5 to load CSV data, apply linear scales, and render an SVG with axes and labels. Axis tick marks extend across the plot area, and custom CSS styles the circles, text, and tick marks. The chart title and axis labels clarify the variables, while the data is fetched from a remote CSV file hosted on VizHub.

BBendrog

88% match

Loading thumbnail…

Cars Scatter Plot

This scatter plot visualizes the relationship between horsepower and miles per gallon (MPG) for a dataset of cars, with each red semi-transparent circle representing a single vehicle. The chart uses D3 v5’s `scaleLinear`, `axisLeft`, and `axisBottom` to construct axes with gridlines, while `csv` loads the auto-mpg data from a remote URL. The SVG rendering includes labeled axes and a title, with circle positions mapped via scaled x and y coordinates.

Aanastasiiaplatovskikh

88% match

Loading thumbnail…

Cars Scatter Plot

This scatter plot visualizes the relationship between acceleration and horsepower for cars from the auto-mpg dataset. D3’s scaleLinear, axisBottom, and axisLeft functions map the quantitative values, while circles are appended to an SVG container. The code loads CSV data via d3.csv, converts numeric fields, and uses margin-based layout with tick marks and axis labels. Red translucent circles reveal density, with axes formatted using d3.format and a title added manually.

Ccledevoute

88% 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

88% match