Skip to main content
SimilarExport ZIP
100%

rao

✓ Published0🌍 Public
RRakshithaRao27
Last edited Mar 27, 2022
Created on Mar 27, 2022

This example displays a scatter plot of the Iris dataset, mapping petal length and petal width while coloring points by species using a custom marker function. It renders as an SVG via React and D3 v6, using `d3.csv` to load data, `scaleLinear` and `extent` for axes, and `axisLeft`/`axisBottom` for tick marks. The code also appends rotated axis labels and sets circle radii, with point colors assigned per species.

AI-generated description

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

See also React Starter.

MIT Licensed

Similar vizzes

Loading thumbnail…

rao

This scatter plot visualizes the Iris dataset, mapping petal length and width on the axes while coloring each point by species (setosa, versicolor, or virginica) using red, blue, and green. It also encodes sepal length and width as elliptical radii for each circle. Built with D3 v6 in a React project, the SVG rendering uses `scaleLinear`, `extent`, `axisLeft`, and `axisBottom` to generate scales and axes from CSV data loaded via `d3.csv`.

RRakshithaRao27
94% match
Loading thumbnail…

rao

This scatter plot visualizes the Iris dataset, mapping petal length and width on the axes while coloring each point by species (setosa, versicolor, or virginica) using red, blue, and green. It also encodes sepal length and width as elliptical radii for each circle. Built with D3 v6 in a React project, the SVG rendering uses `scaleLinear`, `extent`, `axisLeft`, and `axisBottom` to generate scales and axes from CSV data loaded via `d3.csv`.

RRakshithaRao27
94% match
Loading thumbnail…

rao

This animated scatter plot visualizes the Iris dataset, cycling through four different variable pairs (petal width, sepal width, petal length, sepal length) every two seconds. Each point encodes species via color, while the initial rendering uses rectangles with varying rx and ry values rather than uniform circles. Built with D3.js, the visualization uses scaleLinear, scaleOrdinal, axisLeft, and axisBottom within a reusable scatterPlot function. The animation is driven by setInterval, while data loading relies on d3.csv. SVG rendering updates axes and marks dynamically as the selected dimensions change.

RRakshithaRao27
89% match
Loading thumbnail…

rakhi

This visualization displays a scatter plot of the Iris dataset, mapping petal length and width while encoding species with distinct colors (brown, red, and purple). Built with React and D3 v6, the SVG renders circles sized by sepal dimensions, using `scaleLinear`, `extent`, `axisLeft`, and `axisBottom` for axes. Data loads from a GitHub gist via `d3.csv`, and the code applies custom margins and labels to clarify the petal and sepal measurements.

RRakshithaRao27
86% match
Loading thumbnail…

RAK

This D3 scatter plot visualizes the Iris Dataset, mapping petal length and width for each sample while encoding species through color. The circles are positioned using linear scales, with fixed radius but varied rectangular extents on horizontal and vertical axes. It uses `d3.csv` to load data, `scaleLinear` and `extent` for scales, and `axisLeft`/`axisBottom` for axes. The SVG rendering applies dynamic fill colors per species and displays the dataset’s sepal measurements through `rx` and `ry` attributes.

RRakshithaRao27
85% match
Loading thumbnail…

Fork of Scatter Plot with Iris DataSet

This scatter plot visualizes the Iris dataset, mapping petal length and width along the x and y axes while coloring each point by species (setosa, versicolor, virginica) in blue, red, and purple. The code loads data via `d3.csv`, uses `scaleLinear` and `extent` for scaling, and renders SVG circles with `selectAll().join()`. Axis labels are added with `axisLeft` and `axisBottom`, while the plot also encodes sepal measurements as `rx` and `ry` attributes, though these do not visually alter the circle shapes.

RRakshithaRao27
85% 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
84% 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
83% match