Fork of Scatter Plot with Menus

100%

Fork of Scatter Plot with Menus

✓ Published0🌍 Public

Last edited Aug 22, 2024

Created on Aug 22, 2024

An interactive scatter plot of the Iris dataset allows users to select which flower measurements appear on the x- and y-axes through two dropdown menus. Built with React and D3 v5, the visualization renders SVG circles scaled by d3.scaleLinear, with axes generated from tick values. Hovering over a point reveals its precise value via an SVG title tooltip.

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 visualizes the Iris dataset, allowing users to dynamically select which flower measurements appear on the x- and y-axes via dropdown menus. The visualization is built with React and rendered as SVG, using D3 v5 scale functions like `scaleLinear` and `extent` for scaling and axis generation. Data is loaded asynchronously with `d3.csv` from a GitHub-hosted CSV file. Each point represents an iris specimen, with native SVG `<title>` elements providing hover tooltips that display precise values.

Cchar0496

97% match

Loading thumbnail…

Fork of Scatter Plot with Menus

This interactive scatter plot of the Iris dataset allows users to select which flower measurements to display on the x and y axes via two dropdown menus. Built with React and D3 v5, it renders SVG circles and axes, using `scaleLinear` for coordinate mapping and custom components for axes, marks, and menus. The visualization updates dynamically when the user changes the selected attributes.

AAvonlea Fisher

96% match

Loading thumbnail…

Fork of Scatter Plot with Menus

A scatter plot of the Iris dataset allows users to select which flower attributes appear on the X and Y axes via two dropdown menus. Built with React and D3 v5, it uses `scaleLinear` and `extent` to map data to SVG coordinates. Axis components render ticks and labels, while circular marks display each sample with tooltips. The dataset is loaded as CSV and all four numeric measurements plus species are available as axis options.

Ttrissentety

96% match

Loading thumbnail…

Fork of Scatter Plot with Menus

This interactive scatter plot visualizes the Iris dataset, allowing users to explore relationships between four flower measurements. Two dropdown menus let viewers independently select which attribute appears on the x- and y-axes, updating the plot instantly. The visualization uses React for the interactive controls and D3.js’s `scaleLinear` and `extent` for axes and data scaling. Data is fetched as CSV from a GitHub gist, and circle marks with tooltips display each sample, rendered as SVG.

Mmartin_tp@live.dk

96% match

Loading thumbnail…

Fork of Scatter Plot with Menus

This interactive scatter plot visualizes the Iris dataset, allowing users to select which measurements (sepal length, sepal width, petal length, petal width, species) appear on the x- and y-axes via dropdown menus. The visualization is rendered as SVG using React, with D3.js (d3.v5) handling data loading via `csv`, linear scaling via `scaleLinear`, and axis tick generation. Each data point is drawn as a circle whose position and hover tooltip are determined by the selected attributes.

NNikithakatta30

96% match

Loading thumbnail…

Fork of Scatter Plot with Menus

A scatter plot of the Iris dataset allows interactive selection of which measurement attributes (sepal length, sepal width, petal length, petal width, or species) appear on the X and Y axes via dropdown menus. The visualization is rendered as an SVG using React, with D3.js v5 functions like `csv` for data loading and `scaleLinear` for axis scales. Two dropdown components update the selected attributes, triggering re-renders of the axes and circles.

NNikithakatta30

95% match

Loading thumbnail…

Fork of Scatter Plot with Menus

This interactive scatter plot visualizes the Iris dataset, allowing users to explore relationships between four numeric attributes through dropdown menus that dynamically reassign the x and y axes. The visualization uses React for component management and state, d3.v5 for scales and CSV parsing, and renders SVG circles with tooltips showing formatted values. Users can switch between sepal and petal measurements, with axis labels updating accordingly to reflect the selected variables.

EEugenio2192

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

95% match