Fork of Scatter Plot with Menus

100%

Fork of Scatter Plot with Menus

✓ Published0🌍 Public

Last edited Mar 7, 2022

Created on Mar 7, 2022

This interactive scatter plot visualizes automobile data from the UCI Machine Learning Repository’s Auto MPG dataset. Users select which data columns map to the X and Y axes via dropdown menus built with a reusable D3 module. The visualization uses d3.scaleLinear for axes, d3.axisLeft and d3.axisBottom for ticks, and animates circle transitions over two seconds. Data is loaded as CSV and parsed into numeric values.

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…

Fork of Scatter Plot with Menus

This interactive scatter plot visualizes automobile data from the UCI Machine Learning Repository’s Auto MPG dataset, letting viewers explore relationships between numerical attributes. Users select which columns map to the X and Y axes from dropdown menus. The visualization is built with D3 v5, using `scaleLinear`, `axisLeft`, `axisBottom`, and `transition().duration()` to animate circles to their new positions when axes change. Data is loaded via `csv`, and the implementation uses an SVG rendering approach with reusable menu and scatter plot components.

Jjt23346059@gmail.com

98% match

Loading thumbnail…

Fork of 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. The visualization uses D3 v5, with `scaleLinear` for scales, `extent` for domains, and `axisLeft`/`axisBottom` for rendering axes. Each data point is an SVG circle that transitions from the center to its position over 2 seconds using `transition().duration(2000)`. Axis labels update to reflect the selected columns.

PPijush Barman

97% match

Loading thumbnail…

Fork of Scatter Plot with Menus

This interactive scatter plot visualizes automobile 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 built with a reusable `dropdownMenu` function. The visualization uses d3.v5’s `scaleLinear`, `axisBottom`, and `axisLeft` for axes, and renders SVG circles with a 2-second animated transition that staggers each point’s appearance. Attribute mappings update dynamically when menu selections change, leveraging D3’s data joins and the `transition().delay()` method.

Vvivianaaai@qq.com

97% match

Loading thumbnail…

Fork of Scatter Plot with Menus

This scatter plot displays automobile data from the UCI Machine Learning Repository's Auto MPG dataset, with dropdown menus above the chart allowing the user to select which columns map to the X and Y axes. The visualization uses D3 v5's `d3.select`, `d3.csv`, `d3.scaleLinear`, and `d3.extent` to load the data and compute scales. SVG circles are animated with a staggered transition, moving from the chart's center to their positions over two seconds as the axes and labels update accordingly.

Ttiffycshsf

97% match

Loading thumbnail…

Fork of Scatter Plot with Menus

This interactive scatter plot displays automotive data from the UCI Machine Learning Repository’s Auto MPG dataset, letting users choose which columns to map to the X and Y axes via dropdown menus. Built with D3 v5, the visualization uses `scaleLinear` for axes and animates circles with a 2-second transition when selections change. The chart includes axis labels and grid lines, rendered as SVG with opacity-styled red circles. Updates trigger a re-render that re-binds data and transitions circle positions, demonstrating dynamic visualization of multivariate car attributes like horsepower, weight, and acceleration.

Kkzaiets

96% match

Loading thumbnail…

Fork of Scatter Plot with Menus

This scatter plot visualizes car data from the UCI Machine Learning Repository’s Auto MPG dataset, with dropdown menus letting users choose which columns map to the X and Y axes. The visualization uses d3.scaleLinear, d3.axisBottom, and d3.axisLeft to render the axes, while d3.transition animates circles moving to their new positions over two seconds. Data is loaded via d3.csv, and the interactive menus are built with native HTML select elements. The SVG rendering includes gridlines and axis labels that update dynamically.

RRikibens

96% match

Loading thumbnail…

Fork of Scatter Plot with Menus

This interactive scatter plot displays automobile data from the UCI Machine Learning Repository’s Auto MPG dataset, with dropdown menus letting users choose which columns map to the x- and y-axes. The visualization uses D3 v5 to render SVG circles, with animated transitions repositioning points smoothly when axis selections change. The code leverages `d3.csv` for data loading, `d3.scaleLinear` for axis scaling, `d3.axisBottom` and `d3.axisLeft` for tick marks, and custom dropdown menu logic built with standard HTML `<select>` elements. Axis labels update dynamically to reflect the selected columns.

TTCSMFrogdance

96% match

Loading thumbnail…

Fork of Scatter Plot with Menus

This interactive scatter plot displays car data from the UCI Machine Learning Repository’s Auto MPG dataset. Users select which data columns map to the x and y axes using two dropdown menus, rendered with a custom `dropdownMenu` function built on D3 v5. The visualization uses D3 scales (`scaleLinear`), axes (`axisBottom`, `axisLeft`), and SVG circles, with a `scatterPlot` function handling the rendering and axis labels.

Ccoheist

96% match