Fork of CARS SCUPUBOPD

100%

Fork of CARS SCUPUBOPD

✓ Published0🌍 Public

Last edited Feb 23, 2021

Created on Feb 23, 2021

This visualization displays the relationship between horsepower and acceleration for various car models, using a scatter plot where the size of each circle encodes the vehicle’s year and the fill color encodes its weight. The data is sourced from the auto-mpg CSV dataset. The example uses D3 v5’s `scaleLinear`, `axisLeft`, `axisBottom`, and `extent` functions to construct the axes and scales, while circles are appended to an SVG with attributes for position, radius, opacity, and a dynamically computed RGB fill.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of CARS SCUPUBOPD

This scatter plot compares automobile horsepower and acceleration, with each data point’s size encoding model year and its color shading from black to blue representing vehicle weight. The visualization is rendered as an SVG with animated transitions using D3 v5. The code employs `scaleLinear` for all four axes, `axisLeft` and `axisBottom` for grid lines, and `format` for tick labels. Data is loaded asynchronously from a CSV file via the `csv` function, with numerical fields parsed before the `render` function generates the animated circles.

Mmuzzheng

94% match

Loading thumbnail…

CARS SCUPUBOPD

This example visualizes the relationship between horsepower, acceleration, weight, and model year for a dataset of automobiles. The scatterplot positions each car by its acceleration on the x-axis and horsepower on the y-axis, with the radius of each point encoding the vehicle’s model year and the opacity and color reflecting weight. The visualization uses D3 v5 to load the CSV data, apply linear scales, and render the SVG circles. It also includes axis labels and tick marks, with the color of each circle computed using a d3 color constructor.

Mmoowaffles

92% match

Loading thumbnail…

Fork of cars scatter plot II

This scatter plot visualizes the relationship between horsepower and acceleration for a dataset of cars sourced from the UCI Machine Learning Repository’s Auto MPG Data Set. Each green, semi-transparent circle represents a car, with its horizontal position determined by horsepower and vertical position by acceleration. The visualization uses D3 v6 APIs including `select`, `csv`, `scaleLinear`, `axisBottom`, and `axisLeft` to construct the chart. The SVG rendering includes styled grid lines, axis labels, and a title, with data loaded asynchronously from a CSV file.

Nnexus1058

90% match

Loading thumbnail…

Fork of 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 chart uses D3 v5’s `scaleLinear`, `axisLeft`, and `axisBottom` to construct axes, while circles are appended via `selectAll` and `enter`. Data is loaded as CSV and parsed with numeric conversions. The SVG rendering includes custom axis labels and a title, styled through CSS with opacity and tick formatting.

GGerasimos Katsagannis

89% match

Loading thumbnail…

Fork of Cars Scatter Plot

This scatter plot visualizes the relationship between horsepower and weight for cars from the Auto MPG dataset. Red circles represent each vehicle, with axes labeled and a title displayed. The visualization uses D3 v5 with `scaleLinear`, `axisBottom`, and `axisLeft` to construct the plot, while `csv` loads the data. The SVG rendering applies semi-transparent circles and custom tick styling via CSS.

Llemonxixixi

89% match

Loading thumbnail…

Fork of Cars Scatter Plot

This scatter plot visualizes the relationship between horsepower and weight for cars, with each red semi-transparent circle representing a vehicle. The code uses D3 v5’s `csv`, `scaleLinear`, `axisBottom`, and `axisLeft` to load data from the UCI Auto MPG dataset and render an SVG chart. Axes include tick marks and labels, while a title and rotated y-axis label are manually positioned. Filtering and data type conversion occur before rendering, matching the original example’s styling and layout.

AAlexandre Pinho

88% match

Loading thumbnail…

Fork of Cars Scatter Plot

This scatter plot visualizes the relationship between horsepower and weight for cars from the UCI Auto MPG dataset. Each red semi-transparent circle represents a car, with axes labeled and gridlines drawn using D3’s `scaleLinear`, `axisBottom`, and `axisLeft`. The SVG rendering uses d3.csv to load data, parses numeric fields, and appends circles with attributes set via scales. Titles and axis labels are added with D3’s text selections, while styled CSS controls circle opacity, tick marks, and font sizes.

Aaidatabaeva

88% match

Loading thumbnail…

Fork of Cars Scatter Plot

This scatter plot displays the relationship between horsepower and weight for a collection of cars. The visualization uses red semi-transparent circles to represent individual data points, with axis labels and a title clarifying the chart’s purpose. The code loads data from the Auto MPG Data Set via `d3.csv`, then renders the chart as an SVG using D3 v5’s `scaleLinear`, `axisLeft`, and `axisBottom` APIs. Styling is applied through external CSS, and the axes include custom tick formatting and gridlines.

NNALLANATHAN

88% match