Skip to main content
SimilarExport ZIP
100%

Activity 7 Scatter Plot

✓ Published1🌍 Public
BBhavanaGIrni
Last edited Jul 3, 2023
Created on Jul 3, 2023
Forked from HTML Starter

This scatter plot visualizes the Iris dataset, mapping petal length on the x-axis and petal width on the y-axis, with points colored by species (setosa, versicolor, and virginica) using skyblue, lightgreen, and orange. Built with D3 v6 in a React context, the code loads CSV data from GitHub, applies linear scales with `scaleLinear`, and renders SVG circles with attributes for x, y, fill, and radius. Axis labels appear in green text, and the plot resizes to fill the browser window using `window.innerWidth` and `window.innerHeight`.

AI-generated description

A bare minimum HTML page demonstrating use of CSS and JavaScript.

See also React Starter.

MIT Licensed

Similar vizzes

Loading thumbnail…

Activity 7 Scatter Plot

This scatter plot visualizes the Iris dataset, displaying petal length on the x-axis and petal width on the y-axis, with each point colored by species (setosa, versicolor, or virginica) using distinct fills. The SVG chart is built with D3 v6, loading data via the `csv` function from a remote GitHub URL, and using `scaleLinear` for axes, `extent` for domains, and `axisLeft`/`axisBottom` to render ticks. It also applies custom margins, a title, and axis labels with rotation to present the relationships between the flower measurements.

BBhavyaMammai
94% match
Loading thumbnail…

Activity 7 Scatter Plot

This scatter plot visualizes the Iris dataset, plotting petal length on the x-axis and petal width on the y-axis, with each point colored by species (setosa, versicolor, or virginica) using red, skyblue, or pink fills. The SVG rendering uses D3 v6 APIs including `scaleLinear`, `extent`, `axisLeft`, `axisBottom`, and `select` to map the data, with circular marks sized at a fixed radius. Data is loaded from a remote CSV URL via `d3.csv`, and the axes are labeled with petal and sepal dimensions.

SSwapna1915
94% match
Loading thumbnail…

Activity 7 Scatter Plot

This scatter plot displays the Iris dataset, mapping petal length on the x-axis and petal width on the y-axis, with each point colored by species (setosa in black, versicolor in yellow, and virginica in blue). The visualization uses D3 v6 to load the CSV data from a GitHub repository, applies `scaleLinear` and `extent` for scaling, and renders circles as SVG elements with `axisLeft` and `axisBottom` for the labeled axes.

HHemanthh81
94% match
Loading thumbnail…

Activity 7 Scatter Plot

A D3.js scatter plot visualizes the Iris dataset, mapping petal length and petal width to the x- and y-axes, with each point colored by species (setosa, versicolor, virginica). The plot uses SVG rendering and the `d3.csv`, `d3.scaleLinear`, `d3.extent`, `d3.axisLeft`, and `d3.axisBottom` functions to load the data, set scales, and draw axes. The title is styled in red, and axis labels are set in green using SVG `text` elements.

Vvineelaramulapalli32
94% match
Loading thumbnail…

Activity 7 Scatter Plot

This scatter plot visualizes the Iris dataset, showing petal length on the x-axis and petal width on the y-axis. Data points are colored by species—setosa in skyblue, versicolor in lightgreen, and virginica in orange—using D3 v6’s scaleLinear and axis functions. The visualization renders circles with d3.select and join, loaded from a remote CSV via d3.csv. Axis labels are added as SVG text elements, with the plot filling the full browser window.

MManideeprenikindi
94% match
Loading thumbnail…

Activity 7 Scatter Plot

This scatter plot visualizes the Iris dataset, showing petal length against petal width with points colored by species: skyblue for setosa, lightgreen for versicolor, and orange for virginica. The visualization uses D3 v6 scales and axes via d3.scaleLinear, d3.extent, d3.axisLeft, and d3.axisBottom to map the data. Data is loaded as CSV from a GitHub repository, and circles are rendered as SVG elements with fixed radius and dynamic fill colors. The chart includes rotated axis labels for petal length and sepal length.

Mmn0658
94% match
Loading thumbnail…

Activity_6_Task_3

This scatter plot visualizes the Iris dataset, mapping petal length on the x-axis and petal width on the y-axis. Each circle represents an individual flower, colored by species (skyblue for setosa, lightgreen for versicolor, orange for virginica). The code uses D3 v6 functions including `csv`, `scaleLinear`, `extent`, `axisLeft`, and `axisBottom`, rendering as SVG in a React-free HTML page. Data is loaded from a remote CSV via `d3.csv`, with axes labeled in green and a red title.

Lleelakrishnadivi7@gmail.com
94% match
Loading thumbnail…

Activity 7 Scatter Plot

This scatter plot visualizes the Iris dataset, comparing petal length and width for three species: setosa, versicolor, and virginica. Each circle is colored according to species—blue, green, or purple—using a simple switch function. Built with D3 v6, the visualization loads CSV data from a GitHub gist and uses `scaleLinear`, `axisLeft`, and `axisBottom` to render axes in SVG. The plot demonstrates D3’s data-joining with `join('circle')`, mapping attributes like `cx`, `cy`, and `fill` directly from parsed data fields.

Rrikhitakoganti12
94% match