Fork of vehicles Scatter Plot

100%

Fork of vehicles Scatter Plot

✓ Published0🌍 Public

Last edited Oct 26, 2025

Created on Oct 26, 2025

A jittered strip plot shows the distribution of vehicle prices for each drive type (FWD, RWD, AWD), with semi-transparent dots colored by category. Hovering reveals tooltips with year, make, model, price, and fuel type. The visualization uses d3.csv to load data from a GitHub gist and renders circles via SVG, with d3.scaleBand and d3.scaleLinear for axes and d3.axisLeft/axisBottom for grid lines and ticks.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Scatter plot

This interactive scatter plot displays the relationship between car mileage and price, with individual dots colored by fuel type. Built with D3.js (v7), it renders as an SVG chart with axes, labels, and a hover tooltip that reveals the car name, fuel, mileage, and price. The visualization loads a CSV dataset from a GitHub gist, uses `d3.scaleOrdinal` for color mapping, and applies CSS transitions to highlight dots on hover.

Ccharchana0527@gmail.com

83% match

Loading thumbnail…

Fork of Activity6 Tutorial3

A scatter plot visualizes the relationship between vehicle price and mileage for 21 used cars, with each point colored by price tier: green for under $25,000, yellow for $25,000–35,000, orange for $35,000–45,000, and red for over $45,000. Built with D3.js v7, the plot uses `d3.select`, `d3.csv`, `d3.scaleLinear`, `d3.extent`, and `d3.axisBottom`/`d3.axisLeft` to render SVG axes and circles. Hovering over a point triggers a `d3.transition` that enlarges the circle and appends a temporary text tooltip showing the car’s make, model, and price.

Yyadlapallisaisathvik@gmail.com

82% match

Loading thumbnail…

Scatter Plot

This scatter plot visualizes a car dataset, showing fuel efficiency versus price with points colored by car type. Built as a reusable D3.js chart function, it uses `d3.scaleLinear` for both axes, `d3.scaleOrdinal` with `d3.schemeSet2` for categorical colors, and SVG circles with hover tooltips. The data is loaded from a CSV file via `d3.csv` with `d3.autoType`, and rendered in an SVG container with axes generated using `d3.axisLeft` and `d3.axisBottom`.

RRamdas Dheeraj

81% match

Loading thumbnail…

Fork of ICE 6 Scatter Plot (Sai Kaushik Ganji)

This scatter plot visualizes the relationship between vehicle horsepower and price, using point size to encode sales volume and color to distinguish vehicle type. Built with D3.js v7, the visualization renders data from a bundled Car_sales.csv file as an SVG. The plot includes labeled axes, a hover tooltip for detailed inspection, and separate legends for the color-coded vehicle categories and size-scaled sales figures. The implementation uses D3's selection and scale APIs to map the dataset fields to visual encodings.

Kkhushburajan2015@gmail.com

81% match

Loading thumbnail…

Fork of Animated Vehicle Consumption Scatterplot

This fork of the Animated Vehicle Consumption Scatterplot visualizes 2014 vehicle fuel consumption data from dipinpdinesh's GitHub repository. The scatterplot cycles through CO2 emissions, engine size, and cylinder count as the x-axis, plotting each against combined MPG on the y-axis. Using D3.js v6 with selection.join and transition methods, circles animate positions and axes update smoothly. The chart leverages scaleLinear, axisBottom, and axisLeft, with SVG rendering and a timer that reassigns the x-value accessor every 17 seconds.

Ssidobagga

81% match

Loading thumbnail…

Fork of sketch with D3

A scatter plot visualizes the relationship between car mileage and price, with points colored by fuel type (Petrol, Diesel, Hybrid, Electric). Using D3 v7, the code loads data from a CSV file via `d3.csv`, maps values to numeric types, and renders an SVG with `d3.scaleLinear` axes, `d3.axisBottom` and `d3.axisLeft` labels, and a legend built from unique fuel types. The x-axis begins at zero, while the y-axis domain is padded by 10% to improve point visibility.

BBismark Kofi Owusu Sarfo

81% match

Loading thumbnail…

Fork of Scatter plot

This scatter plot visualizes the relationship between car price and horsepower for 50 car models across 10 brands, using color-coded dots to distinguish brands. Built with D3 v7, the SVG chart plots each vehicle as a circle with hover tooltips showing model details like year and exact price. The visualization includes axes, labels, a title, and a color legend. Data comes from a CSV file loaded via d3.csv, with numeric fields parsed and scales applied using d3.scaleLinear and d3.scaleOrdinal with colors from d3.schemeCategory10.

Kkovuribalanagavinay@gmail.com

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

80% match