Skip to main content
SimilarExport ZIP
100%

ICE-6 Scatter Plot

✓ Published0🌍 Public
RRamya19-hub
Last edited Mar 22, 2023
Created on Mar 22, 2023

This scatter plot visualizes the Iris Flower Dataset, mapping sepal length on the x-axis and petal length on the y-axis. Points are colored by species—blue for setosa, yellow for versicolor, and red for virginica—using filled circles rendered as SVG elements. Built with D3 v6 and React, the visualization uses `d3.csv` to load data from a GitHub Gist, `d3.scaleLinear` for continuous axes, and `d3.axisLeft` and `d3.axisBottom` to draw labeled axes. The plot dynamically sizes to the browser window.

AI-generated description

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

See also React Starter.

MIT Licensed

Similar vizzes

Loading thumbnail…

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 point colored by species (setosa, versicolor, or virginica). The visualization uses D3 v6’s `scaleLinear`, `extent`, `axisLeft`, and `axisBottom` to construct axes, while circles are bound to the data via `selectAll` and `join`. Data is loaded asynchronously from a CSV URL using D3’s `csv` function, with numeric parsing applied to all measurements. The chart fills the browser window, displaying axis labels for petal length and sepal length.

Ggayathrikavya
95% match
Loading thumbnail…

ICE6 Iris Dataset Scatter Plot

This visualization displays the Iris dataset as a scatter plot, mapping petal length on the x-axis and petal width on the y-axis. Each point is colored by species—blue for setosa, red for versicolor, and black for virginica. The code uses d3.csv to load the data, d3.scaleLinear and d3.extent to set scales, and d3.axisLeft and d3.axisBottom to render axes. Although sepal length and width are parsed, they are not used for positioning; circles are drawn via SVG with a fixed radius.

BBVNPK001
94% match
Loading thumbnail…

ICE-6 Scatter Plot

This scatter plot visualizes the Iris dataset, plotting petal length against petal width, with each data point colored by species (blue for setosa, black for versicolor, red for virginica). The SVG visualization uses D3 v6 scales (scaleLinear), axes (axisLeft, axisBottom), and data joins to render circles, while React serves as the framework. The code loads data from a CSV URL and parses numeric fields, with additional attributes stored but not affecting the visual encoding.

Kkottenikhil
94% match
Loading thumbnail…

Scatter Plot - ICE6

This scatter plot visualizes the Iris dataset, mapping petal length on the x-axis against sepal length on the y-axis, with each point colored by species (setosa, versicolor, or virginica). The code uses d3.csv to load the data, d3.scaleLinear for both axes, and d3.axisLeft and d3.axisBottom to render ticks. Circles are appended and filled via d3-selection, with hardcoded color values per species. The SVG spans the full window, and axis labels are added as text elements with rotated positioning.

RRaajithaSabbineni
94% match
Loading thumbnail…

ICE6 Scattered plot

This scatter plot visualizes the iris dataset, showing petal length on the x-axis and sepal length on the y-axis, with data points colored by species (black for setosa, red for versicolor, darkgreen for virginica). The visualization uses D3 v6 with React, rendering as SVG via d3.select and d3.scaleLinear for mapping the data. Axes are generated with d3.axisLeft and d3.axisBottom, while the CSV data is loaded asynchronously using d3.csv with custom parsing to convert numeric fields.

Hharika-1929
94% match
Loading thumbnail…

ScatterPlot_ICE6

This scatter plot visualizes the Iris dataset, mapping petal length and width for individual flowers while coloring each point by species (setosa, versicolor, or virginica). The axes are labeled with sepal length and petal length, though the data encoding uses petal dimensions for positioning and sepal dimensions as circle radii. Built with React and d3.v6, the example loads CSV data via `d3.csv`, applies `scaleLinear` and `extent` for scales, and renders SVG circles with attributes driven by the parsed numeric fields. Axis generation uses `axisLeft` and `axisBottom`.

Bbindusreeja
93% match
Loading thumbnail…

Data Visualization - ICE-6 Scatter Plot Graph

This visualization displays a scatter plot of Iris species data, plotting petal length on the x-axis against petal width on the y-axis, with points colored by species (yellow for setosa, blue for versicolor, red for virginica). The SVG rendering uses D3 v6 APIs including `scaleLinear`, `extent`, `axisLeft`, `axisBottom`, and `selectAll` with data joins, while loading the dataset via `d3.csv` from a GitHub gist. The code also maps sepal measurements to the circle’s `rx` and `ry` attributes, though these are not used for visual encoding.

Rrajasrilekkala
93% match
Loading thumbnail…

ICE 6 Scatter Plot

This D3.js scatter plot visualizes the Iris Dataset, plotting petal length on the x-axis and petal width on the y-axis. Data points are color-coded by species: pink for setosa, green for versicolor, and blue for virginica. The visualization encodes each flower’s sepal length and width as the `rx` and `ry` attributes of the circles, adding an additional dimension to the plot. Built with vanilla HTML, it uses `d3.csv` to load the data, `d3.scaleLinear`, `d3.extent`, and `d3.axisLeft`/`d3.axisBottom` for scales and axes, and appends SVG circles to render the marks.

SSnigdha6698
93% match