dv2020-ep34-viz35 - scatter plot w/ color legend

dv2020-ep35-viz36 - scatter plot w/ interactive color legend

This scatter plot visualizes the Iris Dataset, showing petal length against sepal width with points colored by species. An interactive color legend on the right allows users to hover over a species name, which highlights points of that species by fading all other circles to partial opacity. The visualization uses React with D3 v5 scales and SVG rendering, employing `scaleLinear`, `scaleOrdinal`, and custom React components for axes, marks, and the legend. Data is loaded asynchronously via D3's `csv` method from a GitHub gist.

96% match

dv2020-ep33-viz34 - scatter plot w/ color

A scatter plot visualizes the Iris Dataset, showing petal length against sepal width for individual flowers. Each circle is colored by species using a `scaleOrdinal` with a custom color range, and points are semi-transparent to reveal overlapping data. The visualization is built with React and D3 v5, using `scaleLinear` for both axes with padded domains and axis components for tick rendering. The iris data is loaded as CSV and parsed into numeric values for the plot.

95% match

dv2020-ep35-viz37 - scatter plot w/ interactive color legend

This interactive scatter plot visualizes the Iris dataset, mapping petal length against sepal width for individual flower specimens. A color legend categorizes data points by species, and hovering over a legend item highlights that species while fading all other points. Built with React and D3 v5, the visualization uses `scaleLinear` for axes, `scaleOrdinal` for categorical coloring, and SVG-based rendering. The data is loaded remotely via D3’s `csv` function, while hover interactions manage opacity through a `hoveredValue` state.

95% match

dv2020-ep25-viz25 - scatter plot

A scatter plot of the Iris Dataset shows petal length on the x-axis and sepal width on the y-axis, with semi-transparent circular marks. Built with React and D3 v5, it uses `scaleLinear` with `.nice()` for continuous scales, custom `AxisBottom` and `AxisLeft` components for tick rendering, and a `Marks` component that maps data to SVG circles with native `<title>` tooltips. The visualization loads CSV data via D3's `csv` function and displays axis labels for both dimensions.

Scatter_Plot_with_Color_Legend

This scatter plot visualizes the Iris Dataset, showing petal length against sepal width for three iris species, with each point colored by species and accompanied by a categorical color legend. The React-based visualization uses d3.scaleLinear for both axes, d3.scaleOrdinal for color mapping, and renders as SVG. The code imports axis components, color legend, and marks, while loading data asynchronously via d3.csv. Interactive tooltips appear on hover through SVG title elements, formatted using d3.format.

Mmartin

dv.34 - snazzy scatter plot: w/ color legend

This scatter plot visualizes the Iris flower dataset, displaying four numeric measurements (sepal and petal length/width) on the X and Y axes with interactive dropdown menus for selecting which attributes to compare. Species are encoded through a color ordinal scale with a legend in the right margin, and each point includes a hover tooltip showing the species and coordinate values. Built with React and D3 v6, the visualization uses d3.scaleLinear for axes, d3.scaleOrdinal for colors, rendering as SVG circles.

Dataviz 2020_Ep34 - 26. Scatter Plot with Color Legend

This interactive scatter plot visualizes the Iris flower dataset, allowing users to explore relationships between four physical measurements (sepal and petal dimensions) by selecting which variable appears on each axis via dropdown menus. D3.scaleLinear maps the numeric attributes to screen coordinates, while d3.scaleOrdinal assigns categorical colors to the three Iris species, displayed in a custom color legend rendered as SVG circles. The visualization uses React hooks to manage state, D3’s csv parser to load the data, and SVG marks with tooltips for each point.

MMinwoo Pak

Ep. 34 | Scatter Plot with Color Legend

This scatter plot visualizes the classic Iris dataset, plotting petal length against sepal width for three iris species. Each flower is represented by a colored circle, with species differentiated through an ordinal color scale and a dedicated legend. The visualization is built with React and D3 v6, using `scaleLinear` for axes, `scaleOrdinal` for colors, and SVG circles for marks. The data is loaded asynchronously via `csv` from a GitHub gist, with axis components and a color legend created as reusable React components.

YYee Han