Skip to main content
SimilarExport ZIP
100%

Scatter Plot with Menus

✓ Published4🌍 Public
Ssourcebox-bug
Last edited Apr 17, 2019
Created on Apr 17, 2019

This interactive scatter plot lets users explore car data from the UCI Machine Learning Repository's Auto MPG dataset. Two dropdown menus allow selection of which data columns map to the X and Y axes. Built with D3 v5, the visualization uses dropdownMenu to handle menu interactions and scatterPlot with scaleLinear, axisBottom, axisLeft, and transition delays to animate circles into position. The SVG rendering includes gridlines and axis labels.

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…

Scatter Plot with Menus

This interactive scatter plot visualizes car data from the UCI Machine Learning Repository’s Auto MPG dataset. Users control which columns map to the X and Y axes through dropdown menus, with animated transitions moving circles to their new positions over two seconds. Built with D3 v5, the visualization uses `scaleLinear`, `axisBottom`, `axisLeft`, and `transition().delay()` to render the SVG, while `dropdownMenu` handles the interactive selections.

Ssourcebox-bug
98% match
Loading thumbnail…

Scatter Plot with Menus

This interactive scatter plot displays automobile data from the UCI Machine Learning Repository's Auto MPG dataset, allowing users to select which columns map to the X and Y axes through dropdown menus. D3 v3 renders the visualization as SVG, with scales, axes, and circles positioned using d3.scale.linear and d3.svg.axis. The dropdownMenu module handles the menu interactions, while the scatterPlot function uses d3 transition methods to animate circle positions over 2 seconds when a selection changes.

Hhistidiine
98% match
Loading thumbnail…

Scatter Plot with Menus

This interactive scatter plot visualizes automobile data from the UCI Machine Learning Repository's Auto MPG dataset, allowing users to explore relationships between numeric columns. Two dropdown menus let viewers dynamically select which columns map to the x and y axes. Built with D3 v5, the visualization uses `scaleLinear`, `axisBottom`, and `axisLeft` for axes, while circles animate their positions over two seconds with a staggered delay when data changes. SVG rendering displays red, semi-transparent points, and the code demonstrates reusable modules for the scatter plot and dropdown menu logic.

Llubin-liu
97% match
Loading thumbnail…

Scatter Plot with Menus

This interactive scatter plot visualizes car data from the UCI Machine Learning Repository’s Auto MPG dataset. Users select which columns map to the X and Y axes via two dropdown menus, built with a reusable `dropdownMenu` function. The plot uses D3 v5 APIs including `scaleLinear`, `axisLeft`, `axisBottom`, and `extent` for scaling and axes. Circles are rendered with SVG and animate into position via `transition().duration(2000)` with staggered delays, while axis labels reflect the current column selections.

Cceltic660
97% match
Loading thumbnail…

Scatter Plot with Menus

This interactive scatter plot displays automobile data from the UCI Machine Learning Repository Auto MPG dataset, with dropdown menus letting users select which columns map to the X and Y axes. The visualization uses d3.scaleLinear, d3.axisLeft, and d3.axisBottom to render the axes, while the scatterPlot module animates circles with a transition that delays each point's arrival by 10 milliseconds. SVG rendering with semi-transparent red circles reveals data density, and the dropdownMenu component dynamically rebuilds options on each selection.

Nnicfavfar
97% 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 as circles positioned on x and y axes. Two dropdown menus allow users to select which data columns map to each axis, triggering a transition that animates the circles to their new positions. The visualization uses d3.scaleLinear for scaling, d3.axisLeft and d3.axisBottom for axes, and d3.select for DOM manipulation. A custom dropdownMenu module handles the menus, while the scatterPlot module manages SVG rendering with transitions on circle positions.

BBrandon Lehr
97% 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 as circles positioned on x and y axes. Two dropdown menus allow users to select which data columns map to each axis, triggering a transition that animates the circles to their new positions. The visualization uses d3.scaleLinear for scaling, d3.axisLeft and d3.axisBottom for axes, and d3.select for DOM manipulation. A custom dropdownMenu module handles the menus, while the scatterPlot module manages SVG rendering with transitions on circle positions.

BBrandon Lehr
97% match
Loading thumbnail…

Scatter Plot with Menus

This interactive scatter plot displays car data from the UCI Machine Learning Repository Auto MPG dataset. Dropdown menus let users choose which numeric columns map to the X and Y axes, with the plot updating through animated transitions. Built with D3 v5, the visualization uses `scaleLinear`, `extent`, `axisLeft`, and `axisBottom` for scales and axes, while a custom `dropdownMenu` module handles the selection controls. SVG circles render with opacity, and the code leverages `transition().duration()` and `.delay()` to animate points as the selected variables change.

Cceltic660
97% match