Skip to main content
SimilarExport ZIP
100%

Cars Scatter Plot

✓ Published2🌍 Public
AAmar Nath Yogi
Last edited Jan 21, 2020
Created on Jan 16, 2020

This scatter plot displays the relationship between horsepower and weight for a dataset of cars, with each circle representing a vehicle. The chart uses D3 v5’s `scaleLinear`, `axisBottom`, and `axisLeft` to map the quantitative scales and render axes with gridlines. Data is loaded via `csv` from an external auto-mpg dataset and drawn as SVG circles with opacity and hover effects. The code also applies `extent` and `nice` to domain calculations, and styles the visualization with custom CSS for interactive feedback.

AI-generated description

This chart shows the population of the top 10 most populated countries. The data comes from the year 2018 estimate in "United Nations: 2018 World Population Prospects".

MIT Licensed

Similar vizzes

Loading thumbnail…

Cars Scatter Plot

This scatter plot displays the relationship between horsepower and weight for a dataset of cars, with each circle representing an individual vehicle. The visualization uses D3 v5’s `scaleLinear`, `axisBottom`, and `axisLeft` to construct axes with gridlines, while circles are appended to an SVG via data joins. The data is loaded as CSV from an external URL and parsed into numeric values. Styling, including circle opacity and axis label formatting, is defined in an external stylesheet.

JJordan Arnold
97% match
Loading thumbnail…

Cars Scatter Plot

This scatter plot visualizes the relationship between horsepower and weight for a dataset of cars, with each car represented as a red, semi-transparent circle. The chart uses D3.js v5, specifically the `scaleLinear` function for scaling, `axisLeft` and `axisBottom` for the axes, and `extent` to compute the domain from the data. The data is loaded from a CSV file via `csv`, and the visualization is rendered as an SVG. The styles include custom fonts and tick formatting, with axis labels and a title displayed prominently.

Ccyro666
97% match
Loading thumbnail…

Cars Scatter Plot

This scatter plot displays the relationship between horsepower and weight for a dataset of cars, with each point representing a vehicle. The visualization uses D3 v5’s `scaleLinear`, `axisLeft`, and `axisBottom` to construct the axes, while data is loaded via `csv` from an external auto-mpg dataset. Circles are rendered as SVG elements with a steelblue fill and partial opacity, and the chart includes labeled axes and a title, all drawn within an SVG canvas sized 960 by 500 pixels.

TTimmyLu
97% match
Loading thumbnail…

Cars Scatter Plot

This scatter plot displays the relationship between horsepower and weight for a dataset of cars, with each circle representing a vehicle. The visualization uses D3 v5’s `scaleLinear`, `axisBottom`, and `axisLeft` APIs to construct axes with gridlines, while SVG circles are positioned using the scaled x and y values. Data is loaded asynchronously from a CSV file via `d3.csv`, and styling is applied through external CSS for tick text, axis labels, and the semi-transparent red circles.

Nntds12
97% match
Loading thumbnail…

Cars scatter plot

This scatter plot visualizes the relationship between horsepower and weight for a dataset of cars, with each circle representing a vehicle. The plot uses D3 v5’s `scaleLinear`, `axisBottom`, and `axisLeft` to construct axes with grid lines, while the data is loaded via `csv` from an external auto-mpg dataset. Circles are rendered as SVG elements, and axis labels and a title are added as text. The margins and `nice()` scaling ensure readable axis limits.

Uumihito
97% match
Loading thumbnail…

Cars Scatter Plot

This scatter plot displays the relationship between horsepower and weight for a dataset of cars, with each circle representing an individual vehicle. The visualization uses D3 v5’s `scaleLinear` for both axes and `axisBottom`/`axisLeft` to render tick marks, while `csv` loads the auto-mpg dataset. SVG circles are positioned via `xScale` and `yScale`, with semi-transparent purple styling and axis labels added as text elements.

BBarryC7
97% match
Loading thumbnail…

Cars Scatter

This scatter plot displays the relationship between horsepower and weight for a dataset of cars, with each circle representing a vehicle. The visualization uses D3 v5 to render an SVG, employing `scaleLinear` for both axes and `axisBottom`/`axisLeft` to generate tick marks and grid lines. Data from the auto-mpg.csv file is loaded via `csv`, and circles are appended with a fixed radius of 18 pixels, styled red with partial opacity. Axis labels and a title are positioned manually within the chart's margins.

Cclaire1801
97% 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
97% match