Skip to main content
SimilarExport ZIP
100%

Iris Dataset PART - 1

✓ Published1🌍 Public
Ggoyalshivam204
Last edited Jun 20, 2023
Created on Jun 20, 2023

A scatterplot of the Iris dataset shows the relationship between petal length and petal width, with each flower species (setosa, versicolor, virginica) colored red, blue, or green. The visualization uses React components for the axes and marks, while D3 v5's `scaleLinear` and `csv` load and scale the data from a GitHub gist. Axis ticks and circles are rendered as SVG elements, with hover tooltips displaying the species name.

AI-generated description

Loading and visualizing data about CSS named color using React and D3

MIT Licensed

Similar vizzes

Loading thumbnail…

Iris Dataset Scatter Plot

This scatter plot visualizes the Iris dataset, plotting petal length against petal width for individual flowers, with points colored by species (brown for setosa, orange for versicolor, red for virginica). The visualization uses D3.js v6, employing `scaleLinear` and `extent` to map data ranges to screen coordinates, and renders circles as SVG marks via `selectAll` and `join`. Axes are generated with `axisLeft` and `axisBottom`, while the data is loaded asynchronously from a CSV URL using D3’s `csv` function.

SSyed Araib Karim
92% match
Loading thumbnail…

Iris Dataset Scatter Plot

This scatter plot visualizes the Iris dataset, plotting petal length against sepal length for three iris species, each encoded with a distinct color. The visualization is rendered as an SVG using React and D3 v6. It loads the data from a CSV file with d3.csv, parses numeric fields, and applies d3.scaleLinear for the x and y axes, with d3.axisLeft and d3.axisBottom for ticks. Circles are created with D3’s data join, and the chart fills the full window size.

TTejaswi@3271
92% match
Loading thumbnail…

Iris Dataset Scatter Plot

This interactive scatter plot visualizes the Iris dataset, plotting petal length against petal width for individual flowers. Data points are color-coded by species—blue for setosa, red for versicolor, and black for virginica—allowing immediate comparison of species clusters. The visualization loads CSV data using d3.csv, and employs d3.scaleLinear and d3.extent to map the data to screen coordinates, with d3.axisLeft and d3.axisBottom rendering labeled axes. Circles are drawn as SVG elements with d3.selectAll and .join, while the chart also encodes sepal measurements as additional attributes (rx, ry) on each marker.

Ppravalliyaram
92% match
Loading thumbnail…

Iris Dataset Scatter Plot

This visualization displays the classic Iris dataset as a scatter plot, mapping petal length to the x-axis and petal width to the y-axis. Each circle represents an individual flower, with color indicating species: black for setosa, green for versicolor, and yellow for virginica. The code uses d3.csv to load the data, then applies d3.scaleLinear with d3.extent for axes, rendered via d3.axisLeft and d3.axisBottom. The SVG circles are positioned using this scaling, and text labels for axes are appended manually.

AABCDB15
92% match
Loading thumbnail…

Iris Dataset Scatter Plot

This scatter plot visualizes the Iris dataset, mapping petal length on the x-axis and sepal length on the y-axis. Each circle is colored by species—blue for setosa, yellow for versicolor, and red for virginica—with the D3 v6 scaleLinear and extent functions defining the axes. The SVG is rendered full-window, using D3’s csv loader, axisLeft, axisBottom, and join for circles, while custom axis labels are styled with times font.

Ssumitradevipolina
92% match
Loading thumbnail…

Iris Dataset Scatter Plot

This scatter plot visualizes the Iris dataset, comparing petal length against sepal length, with each point colored by species (Iris-setosa in blue, Iris-versicolor in red, and Iris-virginica in black). The visualization uses d3.csv to load and parse the data, then applies d3.scaleLinear and extent to map values to pixel coordinates, drawing circles with SVG. Axes are rendered with d3.axisLeft and d3.axisBottom, and labeled text is added via SVG elements. The plot is displayed full-screen in an HTML page using D3 v6.

Ddivyageethanjali
91% match
Loading thumbnail…

Iris Dataset Scatterplot

This scatterplot visualizes the Iris Dataset, plotting petal length against sepal width for 150 flower samples. The visualization displays data points as circles with a teal fill, using linear scales created with d3.scaleLinear and extent to map the data to SVG coordinates. React components structure the axis and mark rendering, while d3.csv loads and parses the remote dataset, converting numeric fields with unary plus operators. The code includes custom axis components that generate tick marks and labels, and a marks component that renders circles with native SVG title tooltips.

LLaura Johnson
91% match
Loading thumbnail…

iris

This scatter plot visualizes the classic Iris dataset, displaying petal length against sepal width for three iris species. Each circle is colored by species using a d3.scaleOrdinal with a categorical color range, and includes a native SVG <title> tooltip. The visualization is built with React and D3 v5, using d3.scaleLinear scales with extent-based domains and d3.csv for data loading. Axis components are custom-built with React, rendering SVG tick marks and labels with formatted tick values.

JJiaYu07
91% match