Skip to main content
๐ŸŒ Public

Share visualization

Send this visualization to others.

Rendering Data with React & D3 - Stylied scatter plot

Public visualization

Rendering Data with React & D3 - Stylied scatter plot

0 stars1๐ŸŒ Public
Kkeitheade
Last edited Nov 4, 2021
Created on Nov 4, 2021

This scatter plot displays the Iris dataset, plotting sepal length against sepal width for individual flower samples. The visualization uses React components to structure the SVG rendering, with D3.js v7 handling the linear scaling, axis tick generation, and data loading via the `d3.csv` function. Custom React components for the axes and data marks demonstrate a hybrid approach, where D3's `scaleLinear` and `extent` functions compute the chart geometry while React's JSX syntax defines the SVG output, including styled tick marks and circles with hover tooltips.

AI-generated description

React Starter code.

Comments

Sign in to join the discussion.

MIT Licensed