Skip to main content
SimilarExport ZIP
100%

Scattered plot

✓ Published1🌍 Public
Sstanley.shen2003@gmail.com
Last edited Jan 16, 2024
Created on Sep 16, 2023
Forked from D3 Starter

This interactive scatter plot visualizes the classic Iris dataset, showing the relationship between two selected flower measurements. The D3.js visualization uses radio buttons to let users choose which of the four attributes (sepal length, sepal width, petal length, petal width) to plot on the x- and y-axes, with the plot rendering as an SVG. Points are colored by iris species (setosa, versicolor, virginica) using D3's `scaleLinear`, `axisLeft`, and `axisBottom` APIs, with data loaded via `csv`.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Iris Scatter Plot

This interactive scatter plot displays the classic Iris dataset, allowing users to compare any two of the four flower measurements (sepal length/width, petal length/width) by selecting them from dropdown menus. Each of the 150 data points is rendered as a colored circle, with hue indicating one of three Iris species. The visualization uses D3 v5’s `scaleLinear`, `axisBottom`, and `axisLeft` for axes, while `transition().duration().delay().attr()` animates the circles smoothly to their new positions when the axis selection changes. The legend and axis dropdowns are placed beside the plot.

Mmagua
92% match
Loading thumbnail…

Iris Scatter Plot

This interactive scatter plot visualizes the classic Iris dataset, displaying the relationship between two user-selected attributes (sepal length, sepal width, petal length, or petal width) for three iris species. Circles represent individual flowers, color-coded by species, with dropdown menus allowing selection of which measurements appear on the x-axis and y-axis. Built with D3 v5, the visualization uses d3.csv, d3.scaleLinear, d3.scaleOrdinal, d3.axisLeft, and d3.axisBottom to render the SVG chart, complete with gridlines, axis labels, and a legend.

Cchungmin-yu
91% match
Loading thumbnail…

Iris Scatter Plot_0713316

This interactive scatter plot visualizes the classic Iris dataset, displaying the relationships between four flower measurements (sepal length, sepal width, petal length, petal width). Users can select which measurements appear on the x- and y-axes via dropdown menus, with points colored by iris species (setosa, versicolor, virginica). The visualization uses React for component state management and D3 v5 APIs including `csv` for data loading, `scaleLinear` for axis scaling, and `scaleOrdinal` for categorical coloring. Rendered as SVG with custom axes, the plot updates dynamically when users change attribute selections.

Xx112358
91% match
Loading thumbnail…

Iris Scatter Plot

This interactive scatter plot visualizes the classic Iris dataset, displaying measurements of sepal and petal length and width for three Iris species. Users can dynamically select which measurements appear on the x- and y-axes via dropdown menus, with points colored by species and a legend provided. The visualization is built with D3 v5, using `d3.csv` to load the data and `d3.scaleLinear`, `d3.axisBottom`, and `d3.axisLeft` to render scales and axes as SVG elements.

Yyptang5488
91% match
Loading thumbnail…

Iris Scatter Plot

This visualization displays the classic Iris dataset as a scatter plot, allowing the selection of any two of the four measured attributes (sepal length, sepal width, petal length, petal width) for the x- and y-axes via dropdown menus. Each of the 150 iris flowers is represented as a colored circle, with red, blue, and green mapping to the three species. The D3.js code uses `scaleLinear` for axes, `axisLeft` and `axisBottom` for ticks, and constructs the SVG rendering by binding circles to the data, updating their positions based on the chosen columns. A legend to the right lists the species and their corresponding colors.

Hharker2011
91% match
Loading thumbnail…

Iris Scatter Plot

An interactive scatter plot visualizes the classic Iris dataset, mapping sepal and petal measurements to the x and y axes. The visualization offers two dropdown menus that let users change which flower attribute is displayed on each axis. The code uses D3 v5 to load the CSV data, create linear scales, and render SVG circles that transition to new positions with a one-second animation. Points are colored by iris species (setosa, versicolor, or virginica), with a legend and axis labels rendered via `d3.axisBottom` and `d3.axisLeft`.

Wwinniepooh520
91% match
Loading thumbnail…

0813457_scatter_plot

This interactive scatter plot visualizes the Iris dataset, allowing users to select any two of the four features (sepal length/width, petal length/width) for the X and Y axes via clickable buttons. Data points are colored by species (setosa, versicolor, virginica) and rendered as SVG circles. Built with D3 v5, the visualization uses `d3.scaleLinear` for axes, `d3.axisBottom` and `d3.axisLeft` for tick marks, and a custom `buttonPanel` module to handle interactive selections.

Jjessica403420@gmail.com
91% match
Loading thumbnail…

scatter plot form chart

This interactive scatter plot visualizes the classic Iris dataset, displaying the relationship between two user-selected measurements (such as sepal length and petal width) for 150 flowers across three species. Points are color-coded by species, with a legend and labeled axes included. The visualization uses D3 v5 with SVG rendering, employing scales like `d3.scaleLinear` and `d3.scaleOrdinal`, along with `d3.axisBottom` and `d3.axisLeft` for the axes. Dropdown menus allow users to dynamically change which data columns are plotted.

TTrashBoatDora
91% match