Dataviz 9 - Scatter plot with Menus (Interactive Colour Legend)

Dataviz 9 - Scatter plot with Menus (Coloured)

This interactive scatter plot visualizes the Iris Dataset, letting users independently choose which of the four flower measurements to plot on the X and Y axes using React dropdown menus. Species are distinguished by color through a d3.scaleOrdinal mapping to a three-color palette. The visualization is rendered as SVG using React components, with axes and marks generated via d3.scaleLinear, d3.extent, and custom React components for the bottom and left axes, alongside d3.csv for data loading and d3.format for tick labels.

95% match

Scatter Plot 4: Menus,Colors, Interactive Legend

This interactive scatter plot visualizes the Iris dataset, letting users choose which attributes appear on the X and Y axes via dropdown menus. A color legend categorizes points by species, and hovering over a legend entry highlights only the matching points while fading others. Built with React and D3 v5, the chart uses `d3.scaleLinear` for axes, `d3.scaleOrdinal` for colors, and SVG rendering for marks and interactive legend controls.

Zzeeeeem

93% match

Dataviz 9 - Scatter plot with Menus (Colour Legend)

This scatter plot displays the Iris dataset, showing relationships between sepal and petal measurements for three iris species. Users can select different attributes for the X and Y axes via dropdown menus, with species colors differentiated through an ordinal color legend using d3.scaleOrdinal. The visualization uses React with SVG rendering, importing axis components (AxisBottom, AxisLeft), a ColorLegend, and Marks that render circles with tooltips. Data loading relies on d3.csv from a CDN-hosted gist, with linear scales mapping the numeric measurements.

93% match

Dataviz 9 - Scatter plot with Menus (Polished)

This interactive scatter plot visualizes the classic Iris Dataset, displaying measurements of sepal and petal dimensions for three flower species. Dropdown menus on the left allow users to switch which quantitative attributes are plotted on the X and Y axes, with axis labels updating accordingly. Built with React and D3 v5, the visualization uses D3’s `scaleLinear` for axes, `extent` for domain calculation, and leverages SVG circles for each data point. Data is loaded asynchronously via D3’s `csv` function, with dropdowns implemented using the react-dropdown library.

92% match

Scatter Plot with Menus and Colour

This scatter plot of the Iris dataset uses interactive dropdown menus to explore relationships between measurements. Users can select different attributes for the X and Y axes, and the visualization color-codes each point by species using a D3 ordinal scale. Built with React and rendered as SVG, it uses `scaleLinear` for axes, `scaleOrdinal` for colors, and custom React components for the dropdowns and marks. The plot includes axis labels and tick formatting via `format('.2s')`, with tooltips showing the x-value on hover.

NNikita Toropov

Scatter Plot with Menus and Color Legend

Interactive scatter plot of the Iris dataset, implemented with React and D3 v5, visualizes relationships between flower measurements. Users can dynamically select which quantitative attributes to plot on the x and y axes using dropdown menus, while a color legend distinguishes species. The visualization uses D3's scaleLinear, scaleOrdinal, and extent APIs to compute scales, with SVG marks rendered as circles. Data is loaded from a CSV file using D3's csv function. The interface includes custom React components for axes and a color legend, with styling from Poppins fonts and the react-dropdown library.

TTatyana Milanova

Dataviz 9 - Scatter plot with Menus

This interactive scatter plot explores the Iris Dataset, allowing users to dynamically select which flower measurements appear on the x- and y-axes via dropdown menus. Each point represents a flower specimen, positioned according to its sepal and petal dimensions. The visualization uses React for state management and rendering, while D3.js v5 handles data loading, linear scaling (scaleLinear), and SVG axis generation. The data is parsed from a CSV file using D3’s csv function, and axis labels update dynamically to reflect the selected attributes.

Scatter Plot with Menus with color scale and legend

This interactive scatter plot visualizes the Iris Dataset, allowing users to dynamically select which flower measurements appear on the x and y axes via two dropdown menus. Each point is colored by species, with an accompanying color legend. The visualization is built with React and D3 v5, using `scaleLinear` for axes, `scaleOrdinal` for categorical colors, and React state to update the chart based on menu selections. Data is loaded asynchronously with `csv` from a GitHub URL and rendered as SVG circles.

Rrajamrit-singh