Scatter Plot with Menus

100%

Scatter Plot with Menus

✓ Published0🌍 Public

Last edited May 18, 2020

Created on May 15, 2020

This interactive scatter plot displays car data from the UCI Machine Learning Repository’s Auto MPG dataset. Users select which columns to map to the X and Y axes via dropdown menus, and the visualization updates the axes and corresponding data points accordingly. The chart is rendered as an SVG using d3-scales with linear axes, and the menus are built with a reusable dropdownMenu module. The code uses d3’s selection, scaleLinear, extent, axisLeft, and axisBottom APIs, and it incorporates rotated tick labels for readability.

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 scatter plot displays car data from the UCI Machine Learning Repository’s Auto MPG dataset. Two dropdown menus let the user select which columns map to the x- and y-axes. The visualization uses d3.csv to load data, d3.scaleLinear for axes, and d3.axisBottom/axisLeft with tick marks. It renders as an SVG with circles, and updates with a smooth transition that animates each point’s position over two seconds when the selected columns change.

Sshreyan2020

97% match

Loading thumbnail…

Scatter Plot with Menus

This scatter plot displays car data from the UCI Machine Learning Repository Auto MPG dataset, letting users select which columns to map to the X and Y axes via dropdown menus. The plot uses d3.csv to load data, d3.scaleLinear, d3.extent, d3.axisLeft, and d3.axisBottom for scaling and axes, with SVG circles rendered at 10px radius. Menu interactions trigger transitions that animate each circle’s position over 2 seconds with staggered delays. Axes labels update dynamically based on the selected columns, and the visualization includes tick gridlines and rotated Y-axis text.

Cceltic660

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’s Auto MPG dataset. Users select which columns to plot on the X and Y axes via dropdown menus, which re-render the visualization’s axes and circles accordingly. Built with D3 v5, the code uses `scaleLinear`, `axisLeft`, `axisBottom`, and a custom `dropdownMenu` module. Points animate into position over two seconds with staggered delays, and the SVG rendering includes axis labels, tick marks, and semi-transparent red circles.

Ssirmelpalot

97% match

Loading thumbnail…

Scatter Plot with Menus

This scatter plot displays car data from the UCI Machine Learning Repository’s Auto MPG dataset, with dropdown menus letting viewers assign any data column to the X or Y axes. The visualization uses d3.csv for loading, d3.scaleLinear, d3.extent, and d3.axisBottom/axisLeft for scales and axes, while d3.transition animates circles over two seconds when columns change. The code builds menus from data.columns and updates the SVG scatter plot dynamically.

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. Using dropdown menus, viewers can select which numeric columns map to the X and Y axes, with the axis labels updating accordingly. The visualization is built with D3 v5, using `scaleLinear` for coordinate mapping, `axisBottom` and `axisLeft` for tick rendering, and `transition().duration(2000).delay()` for animated circle movement. The SVG scene includes gridlines with custom styling, and all data values are explicitly converted to numbers before plotting.

Ggcappadaniel

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

Loading thumbnail…

Scatter Plot with Menus

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.

Ssourcebox-bug

97% match