Skip to main content
SimilarExport ZIP
100%

Mass/Height Menu

✓ Published1🌍 Public
Cceltic660
Last edited Dec 3, 2018
Created on Dec 3, 2018

This interactive scatter plot from the Auto MPG dataset lets users explore relationships between numeric car attributes by selecting X and Y columns from dropdown menus. The visualization updates dynamically with a 2-second animated transition, using D3 v5’s scaleLinear, axisBottom, axisLeft, and transition methods. Each circle represents a car, colored red with opacity, while dropdown menus are built using a reusable dropdownMenu function that binds to HTML select elements. Data loads from a CSV file containing car specifications, offering flexible comparison across all numeric columns.

AI-generated description

This scatter plot shows data about cars, from UCI Machine Learning Repository: Auto MPG Data Set. The user can select which columns map to X and Y using dropdown menus.

MIT Licensed

Similar vizzes

Loading thumbnail…

Mass/Height Menu

This scatter plot displays car data from the UCI Machine Learning Repository’s Auto MPG dataset, where users select the X and Y columns via two dropdown menus. The plot uses d3’s `scaleLinear`, `axisLeft`, and `axisBottom` for axes, with circles animated via `transition().delay()` to move from an initial position to their data points. The `dropdownMenu` component builds the `<select>` elements, and data is loaded as CSV from a local file.

Ppinardag
94% match
Loading thumbnail…

Mass/Height Menu

This interactive scatter plot from the Auto MPG dataset (UCI Machine Learning Repository) lets users select which columns to map to the X and Y axes via dropdown menus. Using D3 v5, the visualization updates the axes and animates data points smoothly into their new positions as selections change. The code leverages `scaleLinear`, `axisBottom`, `axisLeft`, and transition methods to render SVG circles. The animation uses `transition().duration(200)` and per-point delays, with the dropdowns built through a reusable `dropdownMenu` component.

Cceltic660
93% match
Loading thumbnail…

Mass/Height Menu

This interactive scatter plot from the Auto MPG dataset (UCI Machine Learning Repository) lets users select which columns to map to the X and Y axes via dropdown menus. Using D3 v5, the visualization updates the axes and animates data points smoothly into their new positions as selections change. The code leverages `scaleLinear`, `axisBottom`, `axisLeft`, and transition methods to render SVG circles. The animation uses `transition().duration(200)` and per-point delays, with the dropdowns built through a reusable `dropdownMenu` component.

Cceltic660
93% match
Loading thumbnail…

Mass/Height Menu

This scatter plot explores data from the UCI Machine Learning Repository's Auto MPG dataset, but it displays height and weight measurements from a separate CSV file. Two dropdown menus let users select which columns map to the X and Y axes, updating the plot dynamically. The visualization uses D3 v5's `scaleLinear`, `axisLeft`, `axisBottom`, and `transition` APIs to animate the circles smoothly to their new positions as selections change. The SVG rendering uses semi-transparent green circles to show the data distribution.

HHyosukKim
91% match
Loading thumbnail…

Cars Scatter Plot With Menus

This interactive scatter plot from the Auto MPG dataset lets users explore relationships between car attributes via dropdown menus. Built with D3 v5, it renders animated SVG circles that transition smoothly when the X or Y axis column is changed. The visualization uses `scaleLinear`, `axisLeft`, and `axisBottom` for axes, with `dropdownMenu` handling user selection. A color legend with clickable swatches filters data points. Data loads from a CSV via `csv()` and is processed in `loadAndProcessData`.

Jjons288
89% match
Loading thumbnail…

Scatter Plot with Menus

This interactive scatter plot visualizes the Auto MPG dataset, displaying relationships between car attributes. Dropdown menus allow selection of which numeric columns map to the X and Y axes. The visualization uses d3.scaleLinear for scales, d3.axisBottom and d3.axisLeft for axes, and transitions (transition().duration(2000)) to animate circles from the center to their positions when data changes, with data loaded from a CSV file.

CChenluWang96
89% match
Loading thumbnail…

Scatter Plot with Menus

This interactive scatter plot visualizes the Auto MPG dataset from the UCI Machine Learning Repository, displaying car attributes such as horsepower, weight, and acceleration. Two dropdown menus let users select which columns map to the X and Y axes, with the plot smoothly transitioning to show the new relationship. The visualization uses D3 v5’s `scaleLinear`, `axisLeft`, and `axisBottom` for scales and axes, alongside SVG circles with animated transitions. The reusable `dropdownMenu` and `scatterPlot` modules handle updates, and the code leverages D3’s `csv` loading and data-binding patterns.

Cceltic660
88% match
Loading thumbnail…

Scatter Plot with Menus

This interactive scatter plot visualizes the Auto MPG dataset from the UCI Machine Learning Repository, displaying relationships between various car attributes. Two dropdown menus allow users to select which columns map to the X and Y axes, dynamically updating the visualization. The code uses d3.csv for data loading, d3.scaleLinear for scaling, and d3.axisBottom and d3.axisLeft for axes. Each rendered circle fades in with a 2-second d3 transition animation, while the dropdown menu component is built as a reusable d3 selection pattern with event handling.

Eelevari123
88% match