HW6 — 3D Car Chart

100%

HW6 — 3D Car Chart

✓ Published1🌍 Public

Last edited Oct 8, 2026

Created on Oct 8, 2026

Forked from HW6 — Car Data Visualization

This 3D scatter plot visualizes relationships between engine size, fuel efficiency, and horsepower across simulated car models from 2019–2024, with color encoding vehicle type. Users can drag to rotate the Plotly chart, which is built with the `scatter3d` trace type, and button presets switch between two camera perspectives. Data loads from a CSV using D3's `d3.csv` method, and preprocessing validates required columns and numeric fields before rendering.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

HW6 — Car Data Visualization

This scatter plot shows simulated car data from 2019–2024, mapping engine size on the x-axis against combined fuel efficiency on the y-axis. Each circle represents a model-year combination, with circle area encoding horsepower and color distinguishing vehicle type. The visualization uses D3 v7 with SVG rendering, employing d3.scaleLinear for axes and d3.scaleOrdinal for categorical coloring. Interactive features include hover tooltips and click-to-select highlighting, implemented through d3.select and event listeners. Data comes from a CSV file loaded via d3.csv.

Vvvit.21bq5a0514@gmail.com

90% match

Loading thumbnail…

HW6 — Year Comparison

This interactive D3.js visualization compares simulated car fuel efficiency (MPG) across years 2019–2024, using engine size and vehicle type as axes and color categories. It offers two views: an animated year-by-year transition and a side-by-side small multiples comparison, synchronized with a timed trial feature. The chart uses `d3.csv` to load data, `d3.scaleOrdinal` for color mapping, and SVG rendering with buttons for animation playback and timing. Both views share identical axis ranges and vehicle-type colors, helping users identify upward shifts in MPG for vehicle categories.

Vvvit.21bq5a0514@gmail.com

82% match

Loading thumbnail…

Scatter Plot

This scatter plot visualizes the relationship between horsepower and weight for various car models, with each point representing a vehicle. The chart uses D3’s `scaleLinear` for both axes and renders the data as semi-transparent circles, with gridlines from `axisBottom` and `axisLeft`. The data is loaded from a CSV file via `csv()`, and numeric fields are parsed before plotting. Axes are customized with tick labels and rotated text, while the title “CARS yo” appears above the plot.

CCatriona

82% match

Loading thumbnail…

HW6 Fix

This scatterplot visualizes the relationship between engine Horsepower, Torque, and MPG, with vehicle Layout encoded by color. The code loads data from a CSV file using `d3.csv`, then renders an SVG with `d3.scaleLinear` for x and y positions and `d3.scaleOrdinal` for category colors. Summary statistics display mean and median horsepower, while axes are drawn with D3’s axis components. The visualization demonstrates basic marks and channels, using position, size, and color to encode quantitative and categorical attributes.

RReagan S

81% match

Loading thumbnail…

Scatter Plot cars

This scatter plot displays the relationship between horsepower and weight for various car models, sourced from the auto-mpg dataset. The visualization loads data via `d3.csv` and encodes each car as a circle, using `d3.scaleLinear` for both axes. The code constructs the chart with `d3.select`, `d3.axisBottom`, and `d3.axisLeft`, and removes the default axes domains for a cleaner look. All marks are rendered as SVG elements, with styling applied through a linked stylesheet.

HHaniAlHawasli

81% match

Loading thumbnail…

Scatter Plot

This scatter plot visualizes the relationship between horsepower and weight for various car models, with each point representing a vehicle. The chart uses a red, semi-transparent circle for each data point, and includes labeled axes for horsepower and weight. Built with D3 v5, the code loads the auto-mpg dataset from a CSV file, scales the data using `scaleLinear`, and renders the visualization as an SVG. The axes are configured with `axisBottom` and `axisLeft`, and the plot is styled with custom CSS for tick marks, labels, and the title.

LLonwabo11

81% match

Loading thumbnail…

Scatterplot

This scatterplot visualizes the relationship between fuel efficiency and engine size for a dataset of cars, with each point’s radius representing horsepower and its opacity representing price. The chart uses D3 v6 to load CSV data from a GitHub gist, apply linear scales for the axes and point attributes, and render circles in an SVG. Color encodes car type (Sedan, Coupe, SUV, Truck) via `d3.scaleOrdinal`, with a legend included. Axes are drawn using `d3.axisBottom` and `d3.axisLeft`.

GGorantla Vishnusai

81% match

Loading thumbnail…

Car Dataset

This interactive scatterplot displays the relationships between engine size, fuel efficiency (MPG), and horsepower for a dataset of car models. The visualization uses D3 v7 to load data from a GitHub Gist, and employs linear scales to map quantitative columns to x and y positions. A summary panel displays key statistics, including row count, column names, and the mean and median MPG values, computed with `d3.mean` and `d3.median`. The chart is rendered as an SVG, with axes generated using `d3.axisBottom` and `d3.axisLeft`, and includes styling for the page and chart elements.

SShalom

81% match