HW1_test

HW1 Scatter Plots

This interactive scatter plot visualizes the Iris dataset, showing relationships between sepal and petal measurements across three flower species. Users can dynamically switch which measurements appear on the x and y axes using dropdown menus. The visualization uses D3 scales and axes for data mapping, while React manages the component state and UI controls. Points are rendered as colored circles in SVG, with a legend indicating species assignments. The code follows the React & D3 pattern where React handles the interface and D3’s selection methods update the SVG elements.

YYang Shun Yu

HW1_Scatter Plot

This interactive scatter plot explores the classic Iris dataset, displaying measurements such as petal length and sepal width as colored circles representing species. Users can switch the X and Y axes via dropdown menus to compare any pair of attributes, while hovering over the color legend highlights points from a selected species and fades the rest. The visualization is built with React and D3 v5, rendering SVG marks and axes using components like `AxisBottom`, `AxisLeft`, and `Marks`, with scales from `d3.scaleLinear` and `d3.scaleOrdinal`. Data is loaded asynchronously via D3’s `csv` function.

JJames Huang

HW01-Iris

This interactive scatterplot explores the classic Iris dataset, displaying the relationships between sepal and petal measurements. Users can select any combination of the four attributes for the X and Y axes using radio buttons, and the visualization updates accordingly. The three Iris species are distinguished by color: purple, magenta, and indigo, with a legend shown above the chart. Built with React and D3.js (d3.scaleLinear, d3.axisBottom, d3.axisLeft), the SVG plot is rendered dynamically and responds to window resizing. Data is loaded asynchronously from a CSV file via d3.csv.

YYang Shun Yu

HW1_Iris

This interactive scatterplot displays the Iris flower dataset, letting users compare four measurements (sepal and petal length and width) by selecting attributes for the x- and y-axes via ReactDropdown. Points are colored by species using d3.scaleOrdinal, with a legend that highlights one class on hover. The visualization uses React and d3.v5, rendering circles as SVG marks with d3.scaleLinear axes. Hovering over legend items filters the plotted circles’ opacity, while built-in tooltips show exact values.

SSandyWu7179290504

hw4

This interactive scatter plot displays the Iris flower dataset, showing how sepal and petal measurements vary across three species. Users select which measurement appears on each axis from dropdown menus, while a color legend identifies species. The visualization uses React with D3 v5 utilities, including `scaleLinear`, `scaleOrdinal`, and `extent` to map data to SVG circles. Coordinates derive from the selected CSV-loaded measurements, with axes rendered by custom React components using D3 scales.

JJiaYu07

HW1

This interactive scatterplot visualizes Fisher's Iris dataset, showing how measurements of sepal length, sepal width, petal length, and petal width relate across three flower species. Radio buttons let users select which measurement appears on each axis, updating the plot and axis labels accordingly. The visualization uses D3.js v4 with an SVG rendering, employing `d3.scaleLinear` for axes and `d3.scaleOrdinal` for color mapping to distinguish species.

YYI-CHENG-SHIH645

HW1 Scatter Plot

This interactive scatter plot visualizes the Iris flower dataset, letting users explore relationships between four numeric attributes by selecting which ones appear on the x- and y-axes via React dropdown menus. Each point represents a flower, colored by species according to a d3.scaleOrdinal mapping. The visualization uses React components to render SVG elements, with d3.scaleLinear for axes and d3.extent for domains. The code loads data from a CSV file using d3.csv and renders custom axis components with tick marks.

EEast007

Viz HW1

This interactive scatter plot explores the Iris flower dataset, featuring a menu to switch the x-axis among attributes. Built with React and D3.js v5, it maps sepal and petal measurements using d3.scaleLinear, with color encoding by species via d3.scaleOrdinal. The visualization uses SVG circles for marks and custom React components for axes, dropdowns, and a color legend.

Aa1153724