Skip to main content
SimilarExport ZIP
100%

Fork of ICE-6 Scatter Plot

✓ Published2🌍 Public
MMgk1255
Last edited Jun 24, 2022
Created on Jun 24, 2022
Forked from ICE-6 Scatter Plot

This scatter plot visualizes the Iris dataset, mapping petal length on the x-axis and petal width on the y-axis, with each species color-coded (blue, yellow, red) and circle size proportional to sepal dimensions. Built with D3 v6 in a React context, it uses `scaleLinear`, `extent`, `axisLeft`, and `axisBottom` to render the SVG axes. Data is loaded via `d3.csv` from a GitHub gist, and `selectAll().join()` creates the circles with `r`, `rx`, and `ry` attributes for square-like markers.

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 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
97% 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
97% match
Loading thumbnail…

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

This scatter plot visualizes the Iris dataset, mapping petal length and width for the x- and y-axes while encoding species with blue, yellow, and red markers. Data is loaded via `d3.csv` from a GitHub gist, and each point’s size is additionally modulated by sepal dimensions through the `rx` and `ry` attributes. Built with React and D3 v6, the chart uses `select`, `scaleLinear`, and `extent` to position circles via an SVG `join` operation, with axes rendered by `axisLeft` and `axisBottom`.

Kkollirohit2000
96% 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
96% 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
95% 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
95% 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 sample while coloring points by species (blue, yellow, red). The visualization uses d3.csv to load data, d3.scaleLinear for axes, and D3’s selection joins to render SVG circles with petal dimensions. Axis labels are added via D3’s axisBottom and axisLeft, with text rotated for the y-axis. The chart also encodes sepal length and width as the rx and ry attributes of each circle.

Kkollirohit2000
95% match
Loading thumbnail…

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

This scatter plot visualizes the Iris dataset, mapping petal length and width on the x- and y-axes while encoding species with blue, yellow, and red circles. The code uses D3 v6 APIs including `csv`, `scaleLinear`, `extent`, `axisLeft`, and `axisBottom` to load and render the data as SVG. Circles also store sepal measurements as `rx` and `ry` attributes, though these do not affect the visual display. Axes are labeled in red, and the plot fills the entire browser window with a hidden page margin.

Ppemmasaniprudhvinadh
95% match