Skip to main content
SimilarExport ZIP
100%

Ice 6

✓ Published0🌍 Public
AAmar09nath
Last edited Mar 7, 2022
Created on Mar 7, 2022

This visualization plots the Iris dataset’s petal length against petal width, using a D3.js scatter plot rendered as SVG. Circles are colored by species (light blue, light pink, or yellow) with radii fixed at five pixels. The code fetches CSV data from a GitHub gist, applies `d3.scaleLinear` for axes, and uses `d3.select` and `.join` for efficient element creation. Axis labels and tick marks are styled with custom font sizes.

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-2

This visualization displays the Iris dataset, mapping petal length and width to the x- and y-axes while encoding sepal dimensions through each circle’s rx and ry radii, which are drawn as ellipses rather than standard circles. Species are color-coded (green, purple, orange) via a switch statement, with D3 axes labeled “Sepal length” and “Petal Length” shown at 24px tick font. The code loads CSV data using d3.csv, applies scaleLinear for both axes, and renders SVG circles with d3.selectAll and join. Axis labels are added as SVG text elements with rotation for the y-axis.

NNikhilMakkena
92% match
Loading thumbnail…

ICE 6

This scatter plot visualizes the Iris dataset, mapping petal length and width for each flower sample while coloring points by species. Using D3 v6, the chart renders as SVG circles, with dimensions computed from a linear scale on both axes. The code loads CSV data via `d3.csv`, parses numeric fields, and applies a custom scale for the shapes’ `rx` and `ry` attributes, though the actual circle radius is fixed. Axis components are generated with `axisLeft` and `axisBottom`, and the visualization fills the full browser window.

AAmar09nath
92% match
Loading thumbnail…

ICE 6

This scatter plot visualizes the Iris dataset, mapping petal length and petal width on the x- and y-axes, with each point colored by species. It uses D3 v6 to load CSV data, apply linear scales, and render SVG circles with axes and labels. The code demonstrates `csv`, `scaleLinear`, `extent`, `axisLeft`, `axisBottom`, and the `join` method for binding data to SVG elements. The chart includes custom tick styling and a simplified color scheme for the three iris species.

AAmar09nath
92% match
Loading thumbnail…

ICE 6

This visualization displays the Iris dataset as a scatter plot of Petal Length against Sepal Length, with circles colored by species to emphasize clustering. The D3 v5 code uses `d3.select`, `d3.scaleLinear`, `d3.scaleOrdinal` with `d3.schemeCategory10`, and `d3.axisBottom`/`d3.axisLeft` for axes, plus `d3.legendColor` from the d3-legend library. Data is loaded via `d3.csv` from a GitHub gist, and rendered as SVG circles with a categorical color legend.

Sshabbab01
91% match
Loading thumbnail…

ICE 6

This example displays the Iris dataset as a scatter plot of petal length against petal width, with each data point colored by species. It uses D3 v6 APIs including `csv`, `scaleLinear`, `extent`, `axisLeft`, `axisBottom`, and `select` to load the data, scale axes, and render SVG circles. Although the code defines `rx` and `ry` attributes from sepal measurements, the circles are drawn with a fixed radius, so the plot shows a standard clustered distribution.

AAmar09nath
91% match
Loading thumbnail…

ICE-6 Scatter Plot using Iris datset

This visualization displays the Iris dataset in a scatter plot, showing the relationship between petal length (x-axis) and petal width (y-axis) for three flower species, which are color-coded red, green, and blue. The D3 v6 code loads CSV data from a GitHub gist, uses `scaleLinear` and `extent` to map the numeric ranges, and renders SVG circles with `selectAll` and `join`. Axis labels are added via `axisLeft` and `axisBottom`, with custom text elements for axis titles.

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

ICE-6

This interactive scatter plot displays the Iris dataset, mapping petal length and width for each flower species. The visualization uses D3 v6 to load CSV data from a GitHub gist, with axes labeled to show sepal length and width. Each data point is rendered as a circle with a radius of five pixels, positioned using `scaleLinear` functions. The code applies D3's `selectAll` and `join` pattern to create and update SVG circle elements, while `axisLeft` and `axisBottom` generate the coordinate axes.

Ssaiteja0725
91% match