Stylized Scatter Plot

100%

Stylized Scatter Plot

✓ Published0🌍 Public

Last edited Sep 25, 2019

Created on Sep 25, 2019

This example visualizes the Iris Dataset as a scatter plot, mapping petal length on the x-axis and sepal width on the y-axis. Each flower is rendered as a circular mark, with a native SVG tooltip showing the x-value on hover. The visualization uses React components to structure the axes and marks, while D3 scaleLinear and extent functions handle the data scaling. Axes are drawn with custom D3 ticks and gridlines, styled with a Poppins font and teal color scheme, with source text shown while data loads.

AI-generated description

A scatter plot of The Iris Dataset.

MIT Licensed

Similar vizzes

Loading thumbnail…

Stylized Scatter Plot

This example shows a scatter plot of the Iris Dataset, visualizing petal length against sepal width. Each circle represents a flower sample, with axis labels and tick marks provided by custom React components. The visualization is built with React and D3 v5, using `scaleLinear` for both axes and `csv` to load the data. SVG circles render the marks, and a native `<title>` element provides tooltips showing the tick-formatted values. The styling uses the Poppins font and a teal color for the marks.

YYibo Zhang

97% match

Loading thumbnail…

Stylized Scatter Plot

This stylized scatter plot visualizes the Iris Dataset, plotting petal length against sepal width. The visualization uses D3.js scaleLinear and extent functions to map data coordinates to SVG positions, while React components render the axes and circular marks. The code applies a custom Poppins font and a muted color palette, with a distinct teal fill for data points and subtle gray styling for grid lines and labels. SVG circles include title elements that display tooltips showing the x-value on hover.

Ssommerh

96% match

Loading thumbnail…

Stylized Scatter Plot

This stylized scatter plot visualizes the Iris flower dataset, mapping petal length against sepal width for individual specimens. The visualization uses D3.js utilities—including `csv` for data loading, `scaleLinear` for axes, and `extent` for domain calculation—combined with React to render SVG circles and axis ticks. Each data point is drawn as a small teal circle with a tooltip displaying its value. The chart includes labeled axes with customized tick formatting and a responsive layout, all styled with the Poppins font family.

FFonda Irena Santoso

96% match

Loading thumbnail…

Stylized Scatter Plot

A scatter plot displays the Iris Dataset, plotting petal length against sepal width with a circular mark for each sample. The visualization uses React components to render SVG elements, with d3.scaleLinear for axes scaling and d3.extent for domain calculation. Axes are custom-built components using SVG lines and text, styled with the Poppins font. Data is loaded asynchronously via d3.csv and transformed with numeric type coercion, while tooltips appear on hover through SVG title elements.

RRajat Dangat

96% match

Loading thumbnail…

Stylized Scatter Plot

This stylized scatter plot visualizes the Iris Dataset, plotting petal length against sepal width for individual iris flowers. The visualization employs D3.js scaleLinear functions to map the data domain to SVG coordinates, with React components rendering the axes and circle marks. Custom tooltips display formatted values via the D3 format API. The plot features a clean, minimalist design with Poppins typography, muted gray tick marks, and teal data points, showcasing how aesthetic styling can enhance a classic statistical chart.

Wwindwaver

96% 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

96% match

Loading thumbnail…

Stylized Scatter Plot

This stylized scatter plot visualizes the Iris Dataset, mapping petal length against sepal width. Each circle represents a flower specimen, with a fixed radius and teal fill. The chart uses React components to render SVG axes and marks, while D3’s scaleLinear and extent functions compute the scales from the CSV data. Axis labels and tick formatting are customized, and tooltips display values via SVG title elements.

Ddiska432

96% match

Loading thumbnail…

Stylized Scatter Plot

This scatter plot visualizes the Iris Dataset, mapping petal length against sepal width for individual flowers. The React-based visualization uses D3's `scaleLinear` and `extent` functions to compute scales, while custom SVG components render the axes and circular marks. Styling employs the Poppins font with teal-colored circles and muted gray gridlines. The chart includes labeled axes with rotated y-axis text and a tooltip showing the petal length value on each point hover, loaded asynchronously via D3's `csv` parser.

SShashwat Priyadarshi

96% match