Skip to main content
SimilarExport ZIP
100%

ICE 6 Scatter Plot (Sai Kaushik Ganji)

✓ Published3🌍 Public
SSai Kaushik Ganji
Last edited Oct 14, 2025
Created on Oct 14, 2025
Forked from HTML Starter

This scatter plot visualizes the relationship between horsepower and price for various car models, using the Car_sales.csv dataset. Each point represents a vehicle, with circle size encoding sales volume and color distinguishing vehicle type. The visualization uses D3.js v7 to generate an SVG, implementing linear scales for positioning, a d3.forceCollision layout for point separation, and interactive tooltips that display detailed car information on hover. Grid lines and axis labels provide spatial context for comparing data points.

AI-generated description
MIT Licensed

Similar vizzes

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
92% match
Loading thumbnail…

ICE 7 Reusable scatter plot (Sai Kaushik Ganji)

This interactive scatter plot shows car sales data, displaying price in thousands of USD against horsepower for individual vehicles, with point size reflecting engine size and color/shape encoding vehicle type. The visualization uses D3.js v7’s `d3.csv` to load and parse the Car_sales dataset, and employs `d3.scaleLinear`, `d3.scaleSqrt`, and `d3.scaleOrdinal` to map numeric and categorical variables. Marks are generated using `d3.symbol()` with varying symbol shapes, including circles, crosses, and triangles, demonstrating a reusable charting function that separates configuration from rendering.

SSai Kaushik Ganji
91% match
Loading thumbnail…

ICE_6 scatter plot_Nirupama

This scatter plot visualizes the relationship between Horsepower and Price_in_thousands for car models, with Sales_in_thousands encoded as circle size and Vehicle_type as color. The SVG visualization uses d3.v7 with a linear x-scale for horsepower, a linear y-scale for price, and a sqrt scale for the size encoding. Interactive hover tooltips reveal model-specific details. Data comes from Car_sales.csv, rendered with grid lines and axis labels. Color and size legends provide contextual mapping.

NNirupama Karanam
88% match
Loading thumbnail…

ICE - 7 Scatter Plot

This animated scatter plot visualizes car sales data, cycling through three numeric variables—Units, TotalAmount, and HorsePower—on the x-axis every two seconds while HorsePower remains fixed on the y-axis. Using D3.js version 6.7.0, the visualization leverages `scaleLinear`, `extent`, and `axisLeft`/`axisBottom` to map data points as black circles with white strokes. The `setInterval` function updates the x-axis scale and label, while the `scatterPlot` module handles the join pattern for smooth transitions. Data is loaded via D3’s `csv` from a GitHub raw URL, with axes and labels rendered in the Share Tech font.

66264kusuma@gmail.com
85% match
Loading thumbnail…

ICE_7 Scatter Plot

This animated scatter plot uses D3.js to visualize relationships among numeric car attributes, cycling through pairs of columns like horsepower, price, curb weight, city mpg, engine size, and highway mpg every 3.5 seconds. Circles are colored by drive wheel type via a categorical scale, with axes, labels, and a title updating smoothly through D3 transitions. The data comes from a remote CSV file, and the visualization fills the browser window, using D3 scales, axes, and ordinal color encoding to render the SVG animation.

AAbhiramPudi@my.unt.edu
85% match
Loading thumbnail…

ICE 6 SCATTERPLOT

This scatter plot visualizes the relationship between horsepower and acceleration for 150 cars, with each point colored by car type (compact, sports, or SUV). The visualization uses the D3.js library, specifically employing `d3.scaleLinear` for the x and y axes and `d3.scaleOrdinal` for categorical color mapping, rendering as an SVG with a legend. Data is loaded from an external CSV file containing car performance metrics. The plot clearly shows the trade-off between engine power and acceleration time, with sports cars generally exhibiting higher horsepower and faster acceleration.

Uuguggila@gitam.in
85% match
Loading thumbnail…

ICE-7

This interactive scatter plot displays 120 car records from a CSV file, plotting attributes like horsepower, MPG, weight, and displacement against each other. Users can dynamically select which numeric column drives the x-axis, y-axis, point size, and categorical color (cylinders, origin, or year) via dropdown menus. The visualization, rendered as an SVG using D3 version 7, updates axes, gridlines, and legends in real time. Point radius is scaled with `d3.scaleSqrt` to encode area proportionally, while a hover tooltip shows details about individual cars.

Vvydeeshm@gmail.com
84% match
Loading thumbnail…

ICE 7 Scatter Plot

This scatter plot visualizes the relationship between car engine size and fuel efficiency for 15 car models, using a color-coded circle for each model. D3.v7 loads and parses the CSV, then uses `d3.scaleLinear` for both axes and `d3.scaleOrdinal` to assign vivid colors per car model. The SVG rendering includes labeled axes, axis labels generated via `d3.axisBottom` and `d3.axisLeft`, and hover tooltips that display model details.

Ssaisathwikaguntupalli@gmail.com
83% match