Fork of Vinay

100%

✓ Published1🌍 Public

Last edited Mar 8, 2026

Created on Mar 8, 2026

Forked from Vinay

A scatterplot shows the relationship between petal length and petal width for the Iris dataset, with each point colored purple and partially transparent. Built with React and D3 v7, the code loads tab-separated data via `d3.tsv`, then uses `d3.scaleLinear` and `d3.extent` to map values, `d3.axisBottom` and `d3.axisLeft` for axes, and appends SVG circles with x/y coordinates derived from the scaled data.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Vinay

A purple scatterplot displays the relationship between petal length and petal width for the Iris dataset. Each circle represents a sample, with axes labeled and a bold title. The code uses React and D3 v7 to fetch TSV data, parse numeric values, and render SVG circles via `d3.scaleLinear` and `d3.axisBottom`/`d3.axisLeft`.

VVinay Kumar Parvathini

93% match

Loading thumbnail…

Vinay Task 2

This scatterplot visualizes the relationship between petal length and petal width in the Iris dataset. Each purple circle represents a flower, with positions mapped by D3 linear scales on both axes. The visualization is built using React to manage the component lifecycle, while D3 v7 handles SVG rendering, axis generation, and data loading via `d3.tsv` from a GitHub gist. The chart includes labeled axes and a bold title, with circles styled with semi-transparency to reveal overlapping data points.

VVinay Kumar Parvathini

90% match

Loading thumbnail…

Vinay Task

This example uses a scatterplot to explore the relationship between petal length and petal width in the Iris dataset. It loads the data via `d3.tsv`, converts the numeric fields, and renders purple circles through the SVG-based D3 API. The chart uses `d3.scaleLinear` to map the continuous variables to the plotting area and displays them with `d3.axisBottom` and `d3.axisLeft`. Both axes are labeled, and a bold title describes the plot’s purpose. The visualization is built with React, which manages the container element, while D3 handles the SVG drawing.

VVinay Kumar Parvathini

89% match

Loading thumbnail…

Fork of Fork of Scatterplot with Iris Data

This scatterplot visualizes the Iris dataset, plotting petal length against sepal width for individual flowers. The visualization renders as an SVG using React components, with D3 v7 handling the data loading via `d3.csv` and the linear scales for the axes. Each data point is a circle generated through React components, with tooltips displaying the x-axis value in a compact format. The chart includes labeled axes for petal length and sepal width, and uses `scaleLinear` with `extent` and `max` to compute the scale domains.

AArefa Patwary

88% match

Loading thumbnail…

Fork of Fork of Iris Dataset Scatter Plot

This scatter plot visualizes the classic Iris dataset, showing the relationship between petal length on the x-axis and petal width on the y-axis. Points are colored by species (setosa, versicolor, virginica) using blue, red, and black, with circles that also encode sepal dimensions through their rx and ry attributes. The example demonstrates a decoupled React and D3 integration, where the `useData` hook loads and parses CSV data, and the `viz` function uses d3.scaleLinear, d3.extent, and d3.csv to render SVG circles and axes. The rendering approach combines React state management with D3’s selection and join methods inside a window-sized SVG.

VVenkata Sai Preetham

88% 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

88% match

Loading thumbnail…

Fork of Iris Dataset Scatter Plot

This example shows a scatter plot of the Iris dataset, mapping petal length against petal width, with points colored by species (setosa, versicolor, and virginica). The code uses D3 v6 APIs including `csv`, `scaleLinear`, `extent`, `axisLeft`, and `axisBottom` to load data, scale axes, and render SVG circles. The plot is sized to the full window and uses a fixed radius of 4 pixels for each point. Data is fetched from a GitHub-hosted CSV file.

Vvidhyanamini

87% match

Loading thumbnail…

Fork of Fork of Scatter Plots

This interactive scatter plot visualizes the Iris dataset, allowing users to explore relationships between sepal and petal measurements. The visualization uses React dropdown menus to dynamically switch which measurement attributes are plotted on the x and y axes, with points colored by species. Built with D3.js v5 and rendered as SVG, the code uses `scaleLinear` for axes, `scaleOrdinal` for categorical colors, and `d3.axisBottom`/`d3.axisLeft` to construct the plot. The iris data is loaded via `d3.csv` from a linked gist.

Ssaivinay143

87% match