Skip to main content
SimilarExport ZIP
100%

Fork of ICE6.1

✓ Published0🌍 Public
Hharika-1929
Last edited Jun 25, 2022
Created on Jun 25, 2022
Forked from ICE6.1

This visualization displays the classic Iris dataset, plotting petal length against sepal length as colored points. Each species (setosa, versicolor, virginica) is assigned a distinct color. The code uses D3 v6 with SVG rendering in React, employing `csv`, `scaleLinear`, `extent`, `axisLeft`, and `axisBottom` to load data, scale axes, and render the scatterplot. Axis labels and tick formatting are customized, with circles drawn using `selectAll` and `join`.

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 ICE6 - Iris DataSet for the scatter plot

This scatter plot visualizes the Iris dataset, showing petal length on the x-axis and petal width on the y-axis, with each point colored by species (setosa in green, versicolor in red, and virginica in orange). The visualization also encodes sepal length and width as the `rx` and `ry` properties of the circles, though these do not affect the visible rendering since the radius is fixed. The code uses D3 v6 APIs including `csv` for data loading, `scaleLinear` for scaling, and `axisLeft`/`axisBottom` for axes, rendered as SVG with a React-style declarative join operation.

TTulluripallavi
93% match
Loading thumbnail…

Fork for ICE6- Scatter Plot with Iris DataSet

This visualization uses the Iris dataset to plot petal length and width on the x and y axes, with each point colored by species (setosa, versicolor, or virginica). The circle radii and positions are augmented by the sepal dimensions, though the code assigns both a fixed radius and rx/ry attributes. Built with React and D3 v6, it loads CSV data via `d3.csv`, scales with `d3.scaleLinear`, and renders axes using `d3.axisLeft` and `d3.axisBottom` into an SVG. The scene fills the window with responsive dimensions.

TTulluripallavi
92% match
Loading thumbnail…

Fork of Fork of Fork of Fork of ICE-6 Scatter Plot

This scatter plot visualizes the Iris dataset using D3 v6, mapping petal length and width on the x and y axes while coloring each point by species (setosa, versicolor, or virginica) in blue, yellow, or red. The SVG rendering includes axis labels for petal length and sepal length, though the sepal dimensions are also encoded as the horizontal and vertical radii of each circle, creating elliptical markers. Data is loaded as CSV via `d3.csv`, with scales built through `scaleLinear` and axes generated using `axisLeft` and `axisBottom`.

TTekmal-Bhavana
92% match
Loading thumbnail…

Fork of Fork of Fork of ICE-6 Scatter Plot

This scatter plot visualizes the Iris dataset, mapping petal length and width for each flower specimen while coloring points by species (setosa, versicolor, or virginica). Built with D3 v6 and React, it uses `d3.csv` to load data, `d3.scaleLinear` for axes, and `d3.axisLeft`/`d3.axisBottom` for ticks. The SVG circles use attributes `rx` and `ry` to encode sepal dimensions, though these are not visually discernible because the radius remains fixed. The plot fills the viewport with axis labels in red.

Nnikhilagopi
92% match
Loading thumbnail…

Fork of Fork of Fork of Fork of Fork of ICE-6 Scatter Plot

This scatter plot visualizes the Iris dataset, mapping sepal length on the x-axis and petal width on the y-axis, with points colored by species (blue for setosa, yellow for versicolor, red for virginica). Built with React and D3 v6, it uses `d3.csv` to load data, `d3.scaleLinear` with `d3.extent` for scales, and `d3.axisLeft`/`d3.axisBottom` for axes. Data is rendered as SVG circles via `selectAll().data().join()`, with custom axis labels styled in red.

Vviswak12
92% match
Loading thumbnail…

Fork of Fork of ICE-6 Scatter Plot

This interactive scatter plot visualizes the Iris dataset, mapping petal length and width on the x- and y-axes while coloring each point by species (setosa, versicolor, virginica) using blue, yellow, and red. The SVG circles also encode sepal measurements through their `rx` and `ry` attributes, though these are overridden by the fixed `radius`. Built with React and D3 v6, the code loads CSV data via `d3.csv`, applies `scaleLinear` and `extent` for scales, and renders axes using `axisLeft` and `axisBottom`, with labels styled via CSS.

MMgk1255
92% match
Loading thumbnail…

Fork of Fork of ICE-6 Scatter Plot

This interactive scatter plot visualizes the Iris dataset, mapping petal length and width on the x- and y-axes while coloring each point by species (setosa, versicolor, virginica) using blue, yellow, and red. The SVG circles also encode sepal measurements through their `rx` and `ry` attributes, though these are overridden by the fixed `radius`. Built with React and D3 v6, the code loads CSV data via `d3.csv`, applies `scaleLinear` and `extent` for scales, and renders axes using `axisLeft` and `axisBottom`, with labels styled via CSS.

MMgk1255
92% match
Loading thumbnail…

Fork of Fork of Fork of Fork of ICE-6 Scatter Plot

This scatter plot displays the Iris dataset, mapping petal length and width for each flower sample. Points are colored by species—blue for setosa, yellow for versicolor, and green for virginica—using a custom `switch` statement. The visualization is built with D3 v6 in a React-free HTML page, using `d3.scaleLinear` to establish scales, `d3.csv` to load the data, and SVG circles for rendering. Axis labels for petal length and sepal length are added via SVG text elements, with tick text formatted at 24 pixels.

SSUSHMA CHIRRA
91% match