Axes with 3D

Scatterplot V2 w/ menus

This interactive scatterplot visualizes the Iris dataset, allowing users to dynamically select which flower measurements appear on the x- and y-axes via dropdown menus. The chart renders as an SVG using React, with axes generated through custom components and scales from d3-scale. Dropdown menus are implemented with ReactDropdown and d3.csv loads the data. Axis labels update automatically to reflect selected attributes, and each data point includes a native SVG tooltip showing its x-value.

SSophia Cofone

Stylized Scatter Plot with Menus

This interactive scatter plot visualizes the classic Iris dataset, allowing users to explore relationships between four flower measurements by selecting which attributes appear on each axis via dropdown menus. Built with React and D3 v5, the chart uses SVG for rendering and dynamically updates scales and marks based on user selections. The visualization employs D3’s scaleLinear for positioning, CSV loading through d3.csv, and custom React components for axes and dropdown controls, while colors are randomly assigned per data point from a fixed palette.

PPhronesis

Scatter plot with menus

This interactive scatter plot displays the classic Iris flower dataset, letting users compare any two measured attributes at once. Two dropdown menus independently select the variables assigned to the x and y axes, instantly repositioning all data points. The visualization is built with React and renders SVG elements using D3 scales, axes, and tick formatting. Circles represent individual flowers, with native SVG titles providing hover tooltips showing the x-axis value. Data loading relies on D3's `csv` function, while linear scales and extent computations handle the numerical ranges for each chosen attribute combination.

Rrsulli4

Polished Scatter Plot with Menu

This interactive scatter plot displays the Iris flower dataset, with dropdown menus letting viewers select which of four measurements to plot on the x- and y-axes. The visualization renders as an SVG using React components, with D3 scales (`scaleLinear`, `extent`, `max`, `format`) handling coordinate mapping. Axis components and marks are built from custom React functions, while the third-party `react-dropdown` library provides the selection menus. The chart updates dynamically when menu choices change, and hover tooltips reveal x-values through SVG `<title>` elements.

SSam Hege

Scatter Plot with Menus

This interactive scatter plot visualizes the Iris flower dataset, allowing users to select which numeric attributes appear on the x- and y-axes via dropdown menus. Built with React and D3 v5, it renders SVG circles for each data point, with axes generated through custom React components. The code uses `d3.scaleLinear` for scaling, `d3.extent` for domains, and `d3.csv` for loading data, while `ReactDropdown` provides the menu controls.

Ttharuta

Scatter Plot with Menus

This interactive scatter plot displays the Iris flower dataset, allowing users to compare any two attributes by selecting them from dropdown menus for the X and Y axes. The visualization updates dynamically, with axis labels and scales recalculating to reflect the chosen measurements. Built with React and D3 v5, it uses `scaleLinear` and `extent` to derive scales, renders SVG circles for each data point, and organizes its code into reusable components for axes, marks, and dropdowns. The data is loaded from a CSV file via D3’s `csv` function.

JJohn Patrick Banas

Scatter Plot with Menus

This interactive scatter plot visualizes the Iris dataset, allowing users to explore relationships between four flower measurements. Two dropdown menus independently select the attributes plotted on the x and y axes, with axes and labels updating accordingly. Built with React and D3 v5, it uses `scaleLinear`, `extent`, and `csv` for data loading and scaling. Points are rendered as SVG circles, with tooltips showing formatted values. The interface demonstrates a simple pattern for linking dropdown controls to dynamic axis updates.

CCurran Kelleher

Scatter plot with menus

This interactive scatter plot visualizes the Iris dataset, allowing exploration of relationships between four flower measurements. Two dropdown menus let users select which attribute is mapped to the x-axis and y-axis, dynamically updating the plotted circles and axis labels. The visualization is built with React and rendered as SVG, using D3 v5 utilities like `scaleLinear` for axes and `csv()` for data loading. Hovering over a point reveals its x-value via an SVG `<title>` tooltip.

AAndrea Picciau