Skip to main content
SimilarExport ZIP
100%

Fork of Scatter Plot with Color

✓ Published0🌍 Public
HHaili0109
Last edited Nov 26, 2024
Created on Nov 25, 2024

This fork of a scatter plot visualizes the Iris Dataset, showing sepal length against petal length. Each point is colored by species—setosa, versicolor, or virginica—with a custom color legend on the right. Using D3 7.8.5, the code employs `scaleLinear` for axes, `scaleOrdinal` with a custom color array for categorization, and `selection.join` to manage SVG elements. The axes and color legend are separate modules utilizing `axisLeft`, `axisBottom`, and `colorLegend` functions.

AI-generated description

A scatter plot of the Iris Dataset with a color legend.

See also:

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Scatter Plot with Color

A scatter plot of the Iris Dataset maps sepal length to petal length, with each of the three species (setosa, versicolor, virginica) encoded by a distinct color from the categorical `d3.scaleOrdinal` scheme. The visualization includes labeled x- and y-axes, a color legend with tick marks for species names, and circular markers rendered as SVG elements. Built with D3.js, the code uses `d3.extent`, `d3.scaleLinear`, and `d3.schemeCategory10` to scale data and colors, while custom modules `axes.js` and `colorLegend.js` construct the coordinate system and legend via selection joins.

Jjt23346059@gmail.com
96% match
Loading thumbnail…

Fork of Scatter Plot with Color

A scatter plot of the Iris Dataset maps sepal length to petal length, with each of the three species (setosa, versicolor, virginica) encoded by a distinct color from the categorical `d3.scaleOrdinal` scheme. The visualization includes labeled x- and y-axes, a color legend with tick marks for species names, and circular markers rendered as SVG elements. Built with D3.js, the code uses `d3.extent`, `d3.scaleLinear`, and `d3.schemeCategory10` to scale data and colors, while custom modules `axes.js` and `colorLegend.js` construct the coordinate system and legend via selection joins.

Jjt23346059@gmail.com
96% match
Loading thumbnail…

Fork of Scatter Plot with Color

This example visualizes the classic Iris Dataset as a scatter plot, showing sepal length on the x-axis and petal length on the y-axis. Each of the 150 data points is colored by species using a categorical color scale, with a legend indicating the meaning of each color. The visualization is built with D3 v7, using `d3.scaleLinear` for positioning, `d3.scaleOrdinal` with `schemeCategory10` for colors, and `d3.selection.join` for dynamic element updates. The axes and color legend are implemented as reusable functions that render SVG circles and text elements.

Gg_ivaska@coloradocollege.edu
95% match
Loading thumbnail…

Fork of Scatter Plot with Color

This example shows a scatter plot of the Iris dataset, mapping sepal length on the x-axis and petal length on the y-axis. Each point is colored by species using a categorical scale, with a color legend identifying setosa, versicolor, and virginica. The visualization uses D3.js APIs including `scaleLinear` for axes, `scaleOrdinal` with `schemeCategory10` for colors, and `axisLeft`/`axisBottom` for rendering axes. Data is loaded from a CSV file and parsed with `csvParse`.

RRyan Offstein
95% match
Loading thumbnail…

Fork of Scatter Plot with Color

This scatter plot visualizes the Iris Dataset, showing sepal length against petal length. Each point is colored by species using a categorical color scale from `d3.scaleOrdinal` with `d3.schemeCategory10`. The visualization includes labeled axes and a color legend for species identification. The implementation uses `d3.scaleLinear` for positioning, `d3.extent` for domain calculation, and the `d3.selection` API for declarative rendering. Data is loaded from a CSV file and parsed with `d3.csvParse`.

Bbillmccabeusa@hotmail.com
95% match
Loading thumbnail…

Fork of Scatter Plot with Color_new

This fork of a scatter plot visualizes the Iris Dataset, showing sepal length against petal length. The plot’s marks are colored by species using an ordinal color scale from `d3-scale-chromatic`, with a corresponding color legend generated by the `colorLegend` function. The axes are created with `d3.axisLeft` and `d3.axisBottom`, and the chart is rendered using D3’s selection join API.

PPremkumar
95% match
Loading thumbnail…

Fork of Scatter Plot with Color

This example displays the classic Iris Dataset, plotting sepal length against petal length for 150 flowers and using color to distinguish the three species: setosa, versicolor, and virginica. It includes labeled axes and a color legend. The visualization is built with D3.js, using `scaleLinear` for the axes, `scaleOrdinal` with `schemeCategory10` for color mapping, and the `.join()` pattern to manage SVG elements. The code also modularizes reusable components for rendering axes and the color legend.

CCora
95% match
Loading thumbnail…

Fork of Scatter Plot with Color

This example visualizes the classic Iris dataset as a scatter plot, using sepal length on the x-axis and petal length on the y-axis. Each point’s color encodes the flower species, with a categorical color legend identifying setosa, versicolor, and virginica. The visualization is built using D3.js, leveraging `scaleLinear` for the axes, `scaleOrdinal` with `schemeCategory10` for the color mapping, and the `selection.join` API for declarative SVG creation. A custom `axes` and `colorLegend` module handle the chart’s annotations.

SSaiipriiya
94% match