Skip to main content
SimilarExport ZIP
100%

World map

✓ Published0🌍 Public
BBismark Kofi Owusu Sarfo
Last edited Oct 7, 2025
Created on Oct 7, 2025

This visualization displays the classic Iris flower dataset as a scatterplot, mapping sepal length on the x-axis against sepal width on the y-axis. Each black circle represents a single flower sample, with the plot rendered within a framed chart area using margins. Built with React and D3 v7, the code uses `d3.scaleLinear` for both axes, `d3.extent` to compute the domain from the CSV data, and `d3.axisBottom`/`d3.axisLeft` for ticks. Axis labels are added with custom text elements, and the visualization updates dynamically as the data loads.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

World Map

This example visualizes the Iris dataset as a scatter plot of petal length against sepal length. It uses d3.csv to load the data and d3.scaleLinear with d3.extent to map values to screen coordinates. Circles are rendered in SVG, and d3.axisLeft and d3.axisBottom generate the scales. The plot fills the entire browser window, with data points drawn at a fixed radius of 5 pixels.

BBismark Kofi Owusu Sarfo
90% match
Loading thumbnail…

Scatter Plot

This scatter plot visualizes the Iris dataset, mapping sepal length on the x-axis and sepal width on the y-axis. Each circle represents a flower sample, with a native SVG `<title>` element providing a tooltip on hover. Built with React and D3 v7, the visualization uses `scaleLinear` and `extent` to compute the scales, while custom `AxisBottom` and `AxisLeft` components render the tick marks and labels. The code loads data via D3’s `csv` function, and styling applies distinct colors to the marks and axis elements.

GGabriel
89% match
Loading thumbnail…

Iris dataset

This scatterplot displays the Iris dataset, plotting sepal length on the x-axis and sepal width on the y-axis for each flower sample. The visualization is built with React and D3 v7, using d3.scaleLinear to map data ranges to pixel coordinates within an SVG canvas. Circle marks are generated from the dataset loaded via d3.csv, with axis components rendered as SVG groups containing tick lines and labels. The code includes tooltips via SVG `<title>` elements, though the example page also references an unrelated HTML page and video.

LLento Manickathan
89% match
Loading thumbnail…

world map

This visualization displays Fisher's Iris dataset as an interactive scatter plot, mapping petal length on the x-axis against sepal length on the y-axis. Each flower is rendered as a small circle, with axes and tick labels generated via `d3.axisLeft` and `d3.axisBottom`. The plot fills the browser window, using `d3.scaleLinear` for scaling, `d3.extent` to compute data domains, and `d3.csv` to load the data from a gist. The SVG canvas resizes to the full viewport, and circles are positioned using `d3.select` and the `.join` API.

BBismark Kofi Owusu Sarfo
89% match
Loading thumbnail…

Iris scatterplot

This scatterplot visualizes the Iris flower dataset, plotting sepal length against sepal width for individual specimens. The visualization uses React with SVG rendering, while D3 v5 utilities handle data loading via `d3.csv` and scale construction with `scaleLinear` and `extent`. The code explicitly defines axes through custom `AxisBottom` and `AxisLeft` components, with circular marks rendered by a `Ticks` component. Axis labels appear rotated on the y-axis, and CSS classes style the ticks, marks, and text throughout the chart.

JJulia Hack
89% match
Loading thumbnail…

WorldMap Simple

This example visualizes the classic Iris dataset as a scatter plot, mapping petal length on the x-axis and sepal length on the y-axis. It renders circular marks for each observation using D3 v6’s `csv` loader, `scaleLinear`, and `axisLeft`/`axisBottom` for the axes. The plot fills the entire browser window, leveraging SVG circles with a fixed radius. Data is fetched from a GitHub Gist containing the Iris CSV file, which is parsed with custom number coercion for its four numeric columns.

AAndreas Adam
88% match
Loading thumbnail…

Scatter Plot - iris flower

This scatter plot visualizes the iris flower dataset, mapping sepal length on the x-axis against sepal width on the y-axis. Each circle represents an individual flower sample, with hover tooltips revealing the precise x-value via the native SVG `<title>` element. Built with React and D3 v6, the visualization uses `scaleLinear` for both axes with `.nice()` padding, while custom React components (`AxisBottom`, `AxisLeft`, `Marks`) render SVG ticks and circles. Data is loaded asynchronously from a CSV file using D3’s `csv` function, with numeric parsing applied to all four measurement columns.

AAndres de la Garza
88% match
Loading thumbnail…

Scatter Plot

This interactive scatter plot visualizes the Iris dataset, mapping sepal width and sepal length for individual flowers. The visualization uses D3 v5 functions like `scaleLinear` and `extent` to compute scales, while React components render SVG circles for each data point, complete with tooltips displaying the exact measurements. The chart includes styled axes with tick marks, and the data is loaded asynchronously via the `csv` function from a remote URL. The clean design, featuring teal markers and a Poppins font, emphasizes the distribution and correlation between the two sepal dimensions across the flower species.

Zzarioualid@gmail.com
88% match