Skip to main content
SimilarExport ZIP
100%

Fork of ICE - 6 Scatter Plot

✓ Published0🌍 Public
SSweetierams
Last edited Jun 29, 2022
Created on Jun 29, 2022

This example visualizes the Iris dataset as a scatter plot, mapping petal length and width to the x- and y-axes while coloring points by species (setosa, virginica, and versicolor). Each circle’s `rx` and `ry` attributes are set to the sepal measurements, though the rendering remains circular. The code uses D3 v6 to load CSV data, apply linear scales via `d3.scaleLinear`, and render axes with `d3.axisLeft` and `d3.axisBottom`. The visualization fills the browser window with an SVG, and axis labels highlight petal length and sepal length.

AI-generated description

A vanilla HTML implementation of a D3 scatter plot. Shows the Iris Dataset.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of ICE 6 Scatter plot

This scatter plot visualizes the Iris dataset, mapping petal length and width as x/y coordinates while coloring points by species (setosa, virginica, and versicolor). Each circle’s radius is fixed, though additional sepal measurements are encoded in the `rx` and `ry` attributes, which are set but not visually reflected. The visualization uses D3 v6’s `csv`, `scaleLinear`, `extent`, `axisLeft`, and `axisBottom` to load and render the data as SVG circles, with custom tick font sizing and axis labels for petal length and sepal length.

Cchilukuritagore1427@gmail.com
97% match
Loading thumbnail…

Fork of ICE - 6 Scatter Plot

This scatter plot visualizes the Iris Dataset, displaying petal dimensions along the axes while encoding sepal measurements through elliptical point shapes. D3’s `csv` loader parses the external plant data, with `scaleLinear` mapping values and `axisLeft`/`axisBottom` rendering labeled ticks. Circles, colored by species via a switch statement, use `rx` and `ry` attributes to reflect sepal length and width, offering a six-dimensional view of flower characteristics. The responsive SVG fills the viewport, with rotated text labels for clarity.

SSweetierams
96% match
Loading thumbnail…

Fork of ICE - 6 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, with points colored by species (setosa, virginica, and versicolor). It uses d3.csv to load the data, d3.scaleLinear for axes, and d3.axisLeft and d3.axisBottom to render the scales. Circles are drawn with SVG via d3.selectAll and .join, with dimensions derived from sepal length and width for additional context. The code runs in a vanilla HTML page with D3 v6, using window dimensions for a full-screen responsive layout.

KKeerthipriyaBankuru
95% match
Loading thumbnail…

Fork of Fork of ICE - 6 Scatter Plot

This scatter plot visualizes the Iris dataset, encoding petal length and width on the x- and y-axes, with circles colored by species (setosa in green, virginica in orange, versicolor in blue). It uses D3 v6 to load CSV data, create linear scales with `scaleLinear`, and render SVG circles via `selectAll().join()`. Axes are drawn with `axisLeft` and `axisBottom`, while rotated text labels annotate the axes. Although `rx` and `ry` attributes are set from sepal measurements, the circles remain uniformly sized, and the code does not apply any other encodings or interactions.

SSaiSree0122
95% match
Loading thumbnail…

Fork of ICE - 6 Scatter Plot

This scatter plot visualizes the Iris dataset, mapping petal length and petal width as x and y coordinates while encoding species type with color. It uses d3.csv to load the data, d3.scaleLinear for both axes, and d3.axisLeft and d3.axisBottom for tick marks. Circle marks are generated with d3.selectAll and .join, sized with a fixed radius, though sepal dimensions are computed but not visually used. The SVG canvas fills the window, with axis labels styled via inline attributes.

NNaimisha-M
95% 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
94% 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
94% match
Loading thumbnail…

Fork of Fork of ICE - 6 Scatter Plot

This scatter plot visualizes the Iris dataset, mapping petal length and width for each sample while using color to distinguish species. The circles also encode sepal measurements through their horizontal and vertical radii, creating a multi-dimensional view. Built with D3 v6, the visualization loads CSV data from a GitHub repository and uses `scaleLinear`, `extent`, `axisLeft`, and `axisBottom` to construct the plot. Custom styling sets tick font sizes and axis labels, while the SVG output fills the entire browser window.

NNaimisha-M
94% match