Stylized Scatter Plot

100%

Stylized Scatter Plot

✓ Published1🌍 Public

Last edited Aug 13, 2020

Created on Aug 13, 2020

This scatter plot visualizes the Iris Dataset, mapping petal length against sepal width for individual flowers. Built with React and D3 v5, it uses `scaleLinear` for both axes and renders SVG circles via a custom `Marks` component, with axes generated by `AxisBottom` and `AxisLeft`. The visualization includes formatted tick labels, rotated axis titles, and a native SVG tooltip showing the x-value on hover. Styling uses the Poppins font with custom CSS for marks and gridlines.

AI-generated description

A scatter plot of The Iris Dataset.

MIT Licensed

Similar vizzes

Loading thumbnail…

Stylized Scatter Plot

This stylized scatter plot visualizes the Iris Dataset, mapping petal length against sepal width for individual flowers. The visualization uses React to render SVG circles, with D3’s scaleLinear and extent functions calculating the axes and data domains. Custom AxisBottom and AxisLeft components generate tick marks and labels, while the Marks component adds interactive tooltips via SVG <title> elements. The chart applies a clean aesthetic with Poppins typography, teal markers, and muted gray gridlines, and includes rotated axis labels for readability.

KKrishu

98% match

Loading thumbnail…

Stylized Scatter Plot

This stylized scatter plot visualizes the Iris flower dataset, mapping petal length against sepal width. The code uses React with D3 scales (scaleLinear), and renders SVG circles with native `<title>` elements for tooltips. Axes are built with custom React components using tick marks and formatted labels. The chart applies a Poppins font and muted color palette, with axis labels rotated for readability, all styled through inline CSS.

KKrishu

97% match

Loading thumbnail…

Stylized Scatter Plot

This stylized scatter plot visualizes the Iris Dataset, mapping petal length against sepal width for individual flower samples. The visualization uses React with D3 v5 scales, specifically `scaleLinear` and `extent`, to position circles in an SVG canvas. Axis components generate tick marks and labels, while the `Marks` component renders each data point as a circle with a tooltip showing the x-value. The chart features a Poppins font, custom axis styling, and formatted tick labels using D3's `format` function.

AAkhilesh7866

95% match

Loading thumbnail…

Stylized Scatter Plot

This stylized scatter plot visualizes the Iris flower dataset, mapping petal length on the x-axis against sepal width on the y-axis. Built with React and D3 v5, it renders as an SVG using `d3.scaleLinear` for axes and `Marks` component to draw each data point as a circle. The chart's distinctive aesthetic comes from oversized axis labels, chunky tick marks, and a bold Poppins font, giving the familiar scatter plot a modern, graphic-design feel.

SSnapika

95% match

Loading thumbnail…

Stylized Scatter Plot

This scatter plot visualizes the Iris dataset, showing petal length against sepal width for iris flowers. Built with React and D3 v5, it renders as an SVG with axes generated by custom `AxisBottom` and `AxisLeft` components. The `Marks` component maps data points to circles with tooltips, while scales are created using `scaleLinear` and `extent`. Styling incorporates the Poppins font and a teal color scheme for the marks, with a loading state displayed until the CSV data loads via `useData` and `d3.csv`.

CColin

95% match

Loading thumbnail…

Stylized Scatter Plot

This stylized scatter plot visualizes the Iris Dataset, comparing petal length against sepal width. Each flower is drawn as a circle, with hover tooltips revealing the precise x-axis value. The visualization uses React with D3 v5, leveraging `scaleLinear` for axes, `extent` for domain calculation, and `csv` for dataset loading. A clean, muted color palette and Poppins typography define the aesthetic, while custom `AxisBottom`, `AxisLeft`, and `Marks` components render the SVG output.

Mmuhammadshumas

94% match

Loading thumbnail…

Stylized Scatter Plot

This stylized scatter plot displays the Iris Data Set, mapping petal length against sepal width for individual flowers. The visualization, rendered as an SVG using React and D3 v7, features a clean, modern aesthetic with a Poppins font and a muted color palette. It employs `scaleLinear` to compute the x and y axes, and generates tick marks and labels using the custom `AxisBottom` and `AxisLeft` components. The `Marks` component draws the data points as circles, with HTML `<title>` elements providing tooltip functionality.

KKazushige Okuma

94% match

Loading thumbnail…

Stylized Scatter Plot

A stylized scatter plot visualizes the Iris Dataset, plotting petal length against sepal width for individual flowers. The visualization uses React with D3 v5, employing `scaleLinear` for axes, `extent` for domains, and `format` for tick labels. Circular marks are rendered as SVG elements with tooltips, while custom Axis components draw grid lines and labels. The plot uses the Poppins font and a teal color scheme for a polished, modern appearance.

JJulianWgs

94% match