Skip to main content
SimilarExport ZIP
100%

Interactive Cars Scatter plot

✓ Published1🌍 Public
Vvladvaculin
Last edited Aug 28, 2019
Created on Aug 28, 2019

This interactive scatter plot visualizes the relationship between horsepower and weight for cars from the auto-mpg dataset, with circle size encoding acceleration. Hovering over any point reveals a tooltip displaying the car’s name, origin, and acceleration value. The visualization uses D3 v5’s `scaleLinear` for axes and radius mapping, `axisLeft` and `axisBottom` for gridlines, and SVG circles rendered by `d3.csv`. The chart includes labeled axes, a title, and hover-driven `mouseover`/`mousemove` events for dynamic data inspection.

AI-generated description

Hover to see the details.

MIT Licensed

Similar vizzes

Loading thumbnail…

Interactive Cars Scatter plot

This interactive scatter plot visualizes the relationship between horsepower and weight for cars from the auto-mpg dataset. Each circle's size encodes the car's acceleration, with larger circles representing faster acceleration. The visualization uses D3 v5's scaleLinear, axisBottom, axisLeft, and csv functions to parse data and render SVG elements. Hovering over a circle displays a tooltip with the car's name, origin, and acceleration value. The chart includes labeled axes and a title, with gridlines created via tickSize on the axes.

Vvladvaculin
98% match
Loading thumbnail…

Interactive Cars Scatter plot

This interactive scatter plot visualizes the relationship between vehicle weight and horsepower, with each circle’s radius encoding acceleration. The data originates from the auto-mpg dataset loaded via `d3.csv`. Using D3 v5 with SVG rendering, the code employs `scaleLinear`, `axisBottom`, and `axisLeft` to construct axes and gridlines. Hovering over a circle reveals a tooltip via `mouseover` and `mousemove` events, displaying the car’s name, origin, and acceleration value. The plot includes axis labels and a title.

Vvladvaculin
98% match
Loading thumbnail…

Interactive Cars Scatter plot

This interactive scatter plot visualizes the relationship between horsepower and weight for automobiles, with circle radius encoding acceleration. The visualization uses D3 v5 with SVG rendering, employing `scaleLinear`, `axisLeft`, and `axisBottom` to construct the axes and grid lines. Data loads from a CSV file via `csv()`, and hovering over a circle reveals a tooltip displaying the car name, origin, and acceleration value. The chart includes styled axis labels and a title, with circles becoming lighter on hover.

Vvladvaculin
97% match
Loading thumbnail…

Interactive Cars Scatter plot

This interactive scatter plot visualizes the relationship between horsepower and weight for various car models, with point size mapped to acceleration rate. Built with D3.js v5 and rendered as SVG, the visualization employs linear scales for both axes and encodes acceleration through a radius transformation. Hovering over any data point reveals its acceleration value via a custom tooltip. The plot includes gridlines, axis labels, and a title, with data sourced from the auto-mpg dataset and loaded via CSV.

Vvladvaculin
96% match
Loading thumbnail…

Cars Scatter plot

This scatter plot displays the relationship between horsepower and weight for cars from the auto-mpg dataset, with each car depicted as a circle. Circle size encodes the vehicle’s acceleration, ranging from smaller to larger radii based on a linear scale. The visualization is rendered as an SVG using D3 v5, employing `scaleLinear` for axes, `axisLeft` and `axisBottom` for grid lines and ticks, and `extent`, `min`, and `max` to compute the radius mapping. Data is loaded remotely via `csv`, with all numeric fields parsed.

Vvladvaculin
93% match
Loading thumbnail…

Cars Scatter plot

This scatter plot visualizes the relationship between vehicle weight and horsepower, with each circle's radius encoding acceleration. Based on the auto-mpg dataset, the plot uses D3 v5's `scaleLinear` for position and size scaling, along with `axisBottom` and `axisLeft` to render grid lines and tick marks. Circles are appended as SVG elements with opacity and hover effects. A custom tooltip displays acceleration values on mouseover, while axis labels and a title clarify the chart’s meaning, all styled through external CSS.

Vvladvaculin
93% 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 v5 with SVG rendering, employing `scaleLinear` for both axes and `extent` to set the domain. Circles represent individual data points, colored red with partial opacity, while grid lines are generated via `axisBottom` and `axisLeft` with custom tick sizing. Axis labels and a title are appended as SVG text elements, and the data is loaded asynchronously using `csv` and parsed with numeric coercion.

Rruubi0807@gmail.com
92% match
Loading thumbnail…

Cars Scatter Plot

This scatter plot visualizes the relationship between horsepower and weight for cars, with each circle representing a vehicle from the auto-mpg dataset. The code uses D3 v5’s `scaleLinear`, `axisLeft`, and `axisBottom` to construct the axes, while `csv` loads the data from a remote URL. Each data point is appended as an SVG circle, with styling applied via CSS for fill color and opacity. The visualization includes labeled axes and a title, demonstrating how D3 handles margin-based layouts and custom tick formatting in an SVG rendering.

Sssingh175
92% match