Skip to main content
SimilarExport ZIP
100%

Irish dataset

✓ Published0🌍 Public
AAmar09nath
Last edited Mar 7, 2022
Created on Mar 7, 2022

This example visualizes the Iris dataset as a scatter plot with D3.js v6 in React, mapping petal length and width to the x- and y-axes. Each circle’s fill color distinguishes the three species (setosa, versicolor, and virginica) via a custom marker function. The code loads CSV data from a GitHub gist, parses numeric fields, and uses `scaleLinear`, `extent`, `axisLeft`, and `axisBottom` to render axes with SVG. Although `rx` and `ry` attributes are set from sepal dimensions, they have no visual effect on circles.

AI-generated description

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

See also React Starter.

MIT Licensed

Similar vizzes

Loading thumbnail…

Scatter Plot

This example visualizes the Iris dataset as a scatter plot, mapping petal length and width to the x and y axes while coloring each circle by species (setosa, versicolor, or virginica). It uses D3 v6 with scales (d3.scaleLinear), axes (d3.axisBottom, d3.axisLeft), and data loading via d3.csv. The React and SVG rendering are not explicitly used; instead, the code appends circles directly to an SVG element in the DOM. The dataset is fetched from a GitHub gist and parsed to numeric values before plotting.

Aamiralitah
93% match
Loading thumbnail…

iris data set

This scatter plot visualizes the iris data set, mapping petal length and petal width for each sample while coloring points by species (setosa, versicolor, virginica) using blue, red, and purple. The visualization also encodes sepal dimensions as the `rx` and `ry` attributes of the circles, though these do not affect the visible radius. Built with D3 v6 in React, the code loads CSV data via `d3.csv`, scales axes with `scaleLinear` and `extent`, and renders circles and axes using SVG selections and `axisLeft`/`axisBottom`.

RRakshithaRao27
92% match
Loading thumbnail…

Scatter Plot with Iris DataSet

This scatter plot visualizes the Iris dataset, mapping petal length and width for individual flowers while coloring each point by species (setosa, versicolor, or virginica). It uses D3 v6 within a React-free HTML page, leveraging `d3.csv` for data loading, `scaleLinear` for axes, and `axisLeft`/`axisBottom` for ticks. Circles are rendered via SVG with a fixed radius, and the code also destructures sepal dimensions but only uses them as unused attributes on each circle, not for positioning. The visualization fills the browser window with a large bottom margin.

RRohith arabati
92% match
Loading thumbnail…

Scatter plot

This scatter plot visualizes the Iris dataset, mapping petal length and width for each flower and coloring points by species (setosa, versicolor, virginica). The visualization uses D3 v6 within a React setup, loading CSV data via `d3.csv` and rendering SVG circles. Axes are created with `d3.axisLeft` and `d3.axisBottom`, while scales use `d3.scaleLinear` and `d3.extent`. The chart also includes axis labels, but notably, the x-axis text incorrectly labels petal length as "Sepal_Length," and the circle attributes include non-standard `rx` and `ry` properties.

Kkakumanusreya
91% match
Loading thumbnail…

Scatter Plotting with Iris DataSet

This scatter plot visualizes the Iris dataset, mapping petal length to the x-axis and sepal length to the y-axis, with each point colored by species (setosa, versicolor, or virginica) via a custom marker function. Built with React and D3 v6, it renders SVG circles using `select`, `scaleLinear`, `extent`, `axisLeft`, `axisBottom`, and `csv` to load and parse the data. Axis labels and tick styling are customized with CSS, and the plot dynamically sizes to the browser window.

VVamsi Krishna
91% match
Loading thumbnail…

Iris Dataset Scatter Plot

This visualization uses D3.js v6 to render a scatter plot of the classic Iris dataset, mapping petal length on the x-axis and sepal length on the y-axis. Each circle represents a sample, colored by species (black for setosa, blue for versicolor, red for virginica). The code loads CSV data from a GitHub gist, uses `scaleLinear` and `extent` to compute scales, and renders SVG circles with axis labels, employing `axisLeft` and `axisBottom` for the chart axes.

Mmanvithareddykarra
90% match
Loading thumbnail…

Untitled

This scatter plot visualizes the Iris dataset, encoding petal length and petal width as x and y coordinates, while coloring each point by species. The code also reads sepal length and width values into the `rx` and `ry` attributes of each circle, though these do not affect the visual rendering since `r` is set to a fixed radius. Built with React and D3 v6, it uses `d3.csv` for data loading, `d3.scaleLinear` for scales, and `d3.axisLeft`/`d3.axisBottom` for axes with custom labels.

SSrilekha24
90% match
Loading thumbnail…

Iris Data Set

This example visualizes the Iris flower dataset as a scatter plot, showing the relationship between petal length and sepal width for individual samples. Using React with d3.scaleLinear for both axes and d3.extent for domains, the plot renders SVG circles with native tooltips via <title> elements. The code loads CSV data through d3.csv, formats tick labels with d3.format, and includes custom axis components. A loading state displays "Loading..." text while the data fetch is in progress.

TTaweewat Somboonpanyakul
90% match