Skip to main content
SimilarExport ZIP
100%

Fork of Charan - Scatter Plot using Iris dataset

✓ Published1🌍 Public
Ccharanchand9
Last edited Jun 26, 2022
Created on Jun 26, 2022

This interactive scatter plot visualizes the Iris dataset, mapping petal length and petal width on the x- and y-axes while encoding species with distinct colors (aqua, pink, red) and using sepal dimensions to modulate marker size via the `rx` and `ry` attributes. Built with React and D3 v6, the example fetches CSV data from a remote gist, uses `scaleLinear` and `extent` to compute scales, and renders circles with SVG, adding styled axis labels and ticks via `axisBottom` and `axisLeft`.

AI-generated description

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

See also React Starter.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Fork of Charan - Scatter Plot using Iris dataset

This interactive scatter plot visualizes the Iris dataset, mapping petal length and width as x and y coordinates while encoding sepal length and width as elliptical radii. The visualization uses SVG circles with D3.js v6 scales, axes, and data joins to render the graph, with each species (setosa, versicolor, virginica) assigned a distinct color. The code loads CSV data, parses numeric fields, and positions marks using linear scales, while custom axis labels highlight the mapped variables.

Ccharanchand9
96% match
Loading thumbnail…

Charan - Scatter Plot using Iris dataset

This interactive scatter plot visualizes the Iris dataset, mapping petal length on the x-axis and petal width on the y-axis, while coloring each point by iris species (setosa, versicolor, or virginica) with distinct colors (aqua, pink, and red). The visualization is rendered as an SVG using D3 v6, with axes labeled “Petal-length” and “Sepal-length.” It loads data via `d3.csv`, scales the coordinates with `scaleLinear` and `extent`, and draws the points with SVG `circle` elements, incorporating the raw sepal dimensions as unused `rx` and `ry` attributes. The chart fills the browser window, using margins for axis labels.

Ccharanchand9
93% match
Loading thumbnail…

Fork of Scatter Plot

This scatter plot visualizes the Iris dataset, encoding petal length and width as the x and y coordinates while also mapping sepal length and width to the `rx` and `ry` attributes of each circle. The code uses D3 v6 functions such as `scaleLinear`, `extent`, `axisBottom`, and `axisLeft` within a React-independent SVG rendering context. Each species receives a distinct fill color, and the plot loads CSV data via `d3.csv` with explicit numeric parsing.

Vvarun-030
89% match
Loading thumbnail…

Fork of Scatter Plot for Iris DataSet

This scatter plot visualizes the Iris dataset, displaying petal length and width for three species of iris flowers, each marked by a distinct color. Built with React and D3 v6, the visualization uses `d3.csv` to load data and `d3.scaleLinear` with `d3.extent` to map values to SVG circle positions. The code creates axes with `d3.axisLeft` and `d3.axisBottom`, and applies non-standard `rx` and `ry` attributes to the circles, which are not used for scaling. Data is sourced from a GitHub gist.

Rrohinikotha
89% match
Loading thumbnail…

Fork of Scatter Plot with Iris Data krishna

This interactive scatter plot visualizes the Iris dataset, mapping petal length and width for individual data points, with each point colored by species (setosa in red, versicolor in blue, and virginica in green). It also encodes sepal dimensions in the horizontal and vertical radii of each circular mark, creating a bubble-like effect. Built with React and D3 v6, the code uses `d3.csv` for data loading, `scaleLinear` and `extent` for scaling, and `axisLeft`/`axisBottom` for axes, rendering everything as SVG circles on a full-window canvas. The data is fetched from a remote GitHub gist.

Mmandalasaikrishna007
89% match
Loading thumbnail…

Fork of Fork of Fork of Scatter Plot with Iris DataSet

This scatter plot visualizes the Iris dataset, plotting petal length against petal width, with points colored by species (setosa, versicolor, and virginica). The visualization encodes additional sepal dimensions as circle radii, using the `rx` and `ry` attributes. Built with React and D3 v3, it uses `d3.csv`, `scaleLinear`, `extent`, and `axisLeft`/`axisBottom` to render an SVG, with custom margins, axis labels, and a large canvas-sized layout.

Bblikitha
89% match
Loading thumbnail…

Fork of Data Visualization- Scatter Plot with Iris DataSet

This scatter plot visualizes the Iris dataset, mapping petal length and width on the x and y axes while encoding species with color (violet, orange, and green). The visualization also incorporates sepal measurements as the radius and an elliptical shape for each point. Built with D3 v6 and React, the code uses `d3.csv`, `d3.scaleLinear`, `d3.extent`, `d3.axisLeft`, and `d3.axisBottom` to load data and render SVG circles, with axis labels and a large tick font size for readability.

Sspandhanabadekol
89% match
Loading thumbnail…

Fork of Fork of Data Visualization- Scatter Plot with Iris DataSet

This interactive scatter plot visualizes the Iris dataset, allowing users to explore relationships between sepal and petal measurements via dropdown menus for the x and y axes. Circles are colored by species, with petal length and width shown on the default axes. The visualization is built with React, D3 v6, and SVG, using `scaleLinear`, `extent`, `axisBottom`, and `axisLeft` for scales and axes, with data loaded from a CSV URL.

PPujitha14challagulla
89% match