DV A6 T3

100%

✓ Published1🌍 Public

Last edited Oct 19, 2025

Created on Oct 19, 2025

This visualization shows a parallel coordinates plot for six numeric car attributes—miles per gallon, cylinders, displacement, horsepower, weight, and acceleration—with lines colored by the vehicle’s origin (USA, Japan, Europe) using a small embedded CSV dataset. Using D3 v7, the code constructs vertical linear scales for each dimension via `d3.scaleLinear` and `d3.extent`, positions axes with `d3.scalePoint` and `d3.axisLeft`, and draws the polylines with `d3.line()`. The SVG rendering applies hover effects that increase stroke width and opacity, making individual car records easier to trace.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Untitled

This visualization displays a parallel coordinates plot of automobile data from the cars.csv file, with each line representing a car and each vertical axis a numeric attribute such as economy, horsepower, or weight. The axes can be dragged to reorder dimensions, and brushing on an axis filters the foreground lines to highlight cars matching the selected range. The implementation uses D3 v3 with d3.svg.line for paths, d3.svg.axis for scales, and d3.svg.brush for interactive filtering, rendered as animated SVG.

WWei-Che Chang

83% match

Loading thumbnail…

Untitled

This interactive parallel coordinates plot uses the D3.js v3 library to visualize a dataset of car characteristics, including fuel economy, engine displacement, power, weight, and acceleration. The SVG rendering shows each car as a polyline crossing multiple vertical axes, with steelblue foreground lines for focus and grey lines for background context. Users can drag the axis labels to reorder the dimensions and use the built-in brush component on each axis to filter the displayed cars dynamically, updating the foreground paths in real time.

Eeugene-gilmore

83% match

Loading thumbnail…

Parallel Coordinates

This parallel coordinates visualization displays automotive data from the 1970s and 1980s, with each car represented as a polyline crossing seven axes for metrics like economy, cylinders, power, and weight. Using D3 v3, the SVG-based chart renders gray background lines for all cars and steelblue foreground lines that filter interactively. A d3.svg.brush component on each axis allows users to drag and select ranges along a dimension, dynamically hiding lines that fall outside the brushed extent. The code loads car data from a CSV file and applies linear scales with d3.scale.linear for normalization.

Mmbostock

82% match

Loading thumbnail…

(Q3)

This example visualizes a car dataset as a scatter plot of horsepower against torque, with each point colored by the car’s make and an opacity of 0.7. It uses D3.js v7 (loaded via UNPKG) to fetch a CSV from a GitHub repository, then employs `d3.scaleLinear` for both axes, `d3.extent` for domains, and `d3.scaleOrdinal` with `d3.schemeCategory10` for colors. SVG rendering is used for circles, axis labels via `d3.axisBottom` and `d3.axisLeft`, and a legend built with `selectAll` and `append`.

Rreddyswethuvahana@gmail.com

82% match

Loading thumbnail…

Activity_6 Task3.2

This interactive scatter plot visualizes the relationship between car horsepower and fuel efficiency (MPG), with data points colored by the car's country of origin. Built using D3.js v7, the visualization loads CSV data from a GitHub repository and renders it as an SVG with smooth hover tooltips displaying detailed car information. A legend distinguishes between USA, Europe, and Japan vehicles. The implementation uses standard D3 APIs including `scaleLinear`, `scaleOrdinal`, `axisBottom`, `axisLeft`, and `csv`, applying a `transition` for animated tooltip effects.

JJaiyaGhanta@my.unt.edu

82% match

Loading thumbnail…

Parallel Coordinates

This parallel coordinates plot visualizes the relationships among multiple numeric attributes of classic cars, using the cars.csv dataset. Each car is drawn as a polyline across seven vertical axes representing attributes like fuel economy, cylinders, and power. The visualization uses d3.v3 with SVG rendering, and users can drag axes to reorder dimensions or brush over axis ranges to filter which car polylines remain highlighted. The background lines are rendered in gray with a foreground layer in steelblue.

MMohamedZaki

82% match

Loading thumbnail…

Activity 6

This scatter plot visualizes the relationship between horsepower and miles per gallon (MPG) for cars, with points colored and shaped by origin (USA, Europe, Japan). The visualization uses d3.csv to load data from a GitHub-hosted CSV file and renders the chart as an SVG with d3.v7. Interactive tooltips appear on mouseenter to display car details, while a legend indicates the mapping between shape, color, and origin. The implementation uses d3.scaleOrdinal, d3.symbol, and d3.axisBottom/axisLeft to create the marks and scales.

Bbhargavipagolu2025@gmail.com

82% match

Loading thumbnail…

Activitity6_Question3

This scatter plot visualizes the relationship between horsepower and miles per gallon (MPG) for a cars dataset, with each circle colored by the vehicle’s origin (USA, Europe, or Japan). The visualization uses D3 v6 to load CSV data via `d3.csv`, parse and filter the rows, and render SVG circles with linear scales for both axes. Axis labels and ticks are added using `axisLeft` and `axisBottom`, while the full window width and height define the chart area. The code explicitly filters out rows with missing or invalid numeric values before mapping the data points.

GGunna,Praneeth Reddy

81% match