Skip to main content
SimilarExport ZIP
100%

Fork of Scatter Plot with Menus

✓ Published0🌍 Public
Pparshwa30122002@gmail.com
Last edited Aug 14, 2024
Created on Aug 14, 2024

A fork of the classic scatter plot, this visualization displays the Iris Dataset with interactive dropdown menus that allow users to select which attribute to map to the x-axis and y-axis. Built with React and D3 v5, the SVG chart uses `scaleLinear` for axes and renders circles as marks, with tooltips showing values. The code demonstrates reusable components for axes, dropdowns, and marks, and loads data via D3's `csv` function.

AI-generated description

A scatter plot of The Iris Dataset.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Scatter Plot with Menus

This interactive scatter plot displays the classic Iris Dataset, allowing users to compare any two measured attributes by selecting them from dropdown menus for the X and Y axes. Built with React and D3 v5, the visualization renders data points as SVG circles with native tooltips. The charts axes are generated using custom React components that leverage D3 scales. The interface is implemented using the `react-dropdown` library, while data loading and parsing are handled by D3's `csv` function.

EEugenio2192
95% match
Loading thumbnail…

Fork of Scatter Plot with Menus

This interactive scatter plot visualizes the Iris dataset, allowing users to select which attributes to display on each axis via dropdown menus built with React state. The visualization uses D3 v5’s `scaleLinear`, `extent`, and `format` functions to map data values to SVG circle positions rendered through React components, with transitions applied when axes change. The chart includes labeled axes and tooltips showing the x-value for each point.

CChintan Sawla
95% match
Loading thumbnail…

Fork of Scatter Plot with Menus

This interactive scatter plot displays the classic Iris dataset, allowing users to explore relationships between four measured attributes and species through dropdown menus that dynamically reassign the x- and y-axes. Built with React and rendered as SVG using D3 v5, the visualization updates scales and marks via state changes triggered by the dropdown selections. The code leverages `scaleLinear`, `extent`, and `csv` for data loading and scaling, with custom React components for axes, marks, and menu controls.

XXiaoyu Su
95% match
Loading thumbnail…

Fork of Scatter Plot with Menus

This interactive scatter plot displays the Iris dataset, allowing users to select which quantitative attributes appear on the x- and y-axes through two dropdown menus built with React state. The visualization is rendered as an SVG, with axes and circles generated by D3 v5 scales and React components. Data is loaded asynchronously from a CSV file using d3.csv, and the plot updates dynamically when dropdown selections change.

EEdgar Alves
94% match
Loading thumbnail…

Fork of Scatter Plot with Menus

This is an interactive scatter plot of the classic Iris Dataset, featuring dropdown menus to select which quantitative attribute is mapped to the x and y axes. The visualization displays all 150 flowers, with each point’s species identifiable through the available attributes. Built with React and d3, the code uses React’s `useState` hooks to manage selected axes, d3’s `scaleLinear`, `extent`, and `csv` for data loading and scaling, and custom React components for the axes and marks. SVG circles render the data points, with axis labels updating dynamically based on menu selections.

Hhung2606
94% match
Loading thumbnail…

Fork of Scatter Plot with Menus

This interactive scatter plot displays the Iris dataset, a classic multivariate flower dataset, with five attributes selectable for the x- and y-axes through dropdown menus. React manages the component state and user interactions, while D3’s `scaleLinear`, `extent`, and `csv` handle data loading and scaling. The visualization renders as SVG, with marks shown as circles and axis labels derived from menu selections.

Iiffath.namira@csedge.org
94% match
Loading thumbnail…

Fork of Scatter Plot with Menus

This interactive scatter plot, built with React and D3.js v5, visualizes the classic Iris Dataset, which contains measurements of sepal and petal dimensions for three iris species. Two dropdown menus allow users to independently select which quantitative attribute is mapped to the x-axis and y-axis, dynamically updating the linear scales and the displayed points. The visualization renders as an SVG, with each data point drawn as a circle. The code uses `d3.csv` to load the data and `d3.scaleLinear` to generate the axes, with React's `useState` managing the selected attributes.

SSam
94% match
Loading thumbnail…

Fork of Polished Scatter Plot with Menus

This interactive scatter plot visualizes the Iris Dataset, featuring dropdown menus to select which measured attribute appears on the x- and y-axes. The visualization updates the axes and data points in response to user selections, with tooltips showing the x-value for each circle. Built with React and D3 v5, the code uses `scaleLinear` for axes, `csv` for data loading, and `ReactDropdown` for the menu controls. The SVG rendering separates axis and mark components, employing D3’s `extent` and `max` for domain calculations.

HHenry-Bayly
94% match