Fork of reasuable saatter plot

100%

Fork of reasuable saatter plot

✓ Published2🌍 Public

Last edited Oct 25, 2025

Created on Oct 25, 2025

This fork of a reusable scatter plot displays the Iris dataset, mapping petal width against sepal length and encoding species with different symbol shapes. The code uses d3.csv to load the data, d3.scaleLinear for axes, and d3.scaleOrdinal to assign symbols from d3.symbols. It renders SVG paths with a d3.symbol generator sized via the `size` property. Axis labels use d3.axisLeft and d3.axisBottom, with a margin object controlling layout.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Reusable scatter plot with different symbols

This scatter plot visualizes the Iris Dataset, mapping petal width against sepal length and encoding species with distinct D3 symbols. The visualization uses a reusable `scatterPlot` function that leverages `d3.scaleLinear`, `d3.scaleOrdinal`, `d3.axisLeft`, `d3.axisBottom`, and `d3.symbol` to render SVG paths. The dataset is loaded as CSV via `d3.csv` and parsed into numeric values. Axis tick labels are styled at 24px, with the plot filling the entire browser window.

SSharanyaSriram

93% match

Loading thumbnail…

Fork of Reusable scatter plot with different symbols

This example displays the Iris Dataset as a scatter plot, mapping petal width and sepal length to x and y positions while encoding species with distinct D3 symbols. The code uses d3.csv for data loading, d3.scaleLinear and d3.scaleOrdinal for scales, and the d3.symbol API to generate path shapes. Axes are rendered with d3.axisLeft and d3.axisBottom. The visualization is a reusable module, created via a custom scatterPlot function that is called once within an SVG container sized to the viewport.

Nnsatyaprakash22

93% match

Loading thumbnail…

Fork of Fork of Reusable scatter plot with different symbols

This reusable D3 scatter plot visualizes the Iris dataset, mapping petal width to the x-axis and sepal length to the y-axis. Each species is represented by a distinct symbol from the d3.symbols collection, with the symbol type determined by a d3.scaleOrdinal. The code uses d3.scaleLinear for axes, d3.axisLeft and d3.axisBottom for ticks, and d3.csv to load the data. Rendering is done via SVG paths, with the chart configured through a custom reusable function pattern.

MMokshithabhi

93% match

Loading thumbnail…

Fork of Reusable scatter plot with different symbols

This scatter plot visualizes the Iris dataset, mapping petal width and sepal length on the x and y axes, with each species represented by a distinct D3 symbol shape. Built as a reusable D3 module, it uses `scaleOrdinal` to assign symbols, `scaleLinear` for axes, and `symbolGenerator` to generate SVG paths. The code draws axes with `axisLeft` and `axisBottom`, and loads data asynchronously via `d3.csv`.

SSravaniPosina

92% match

Loading thumbnail…

Fork of Fork of Reusable scatter plot with different symbols

This scatter plot visualizes the Iris dataset, mapping petal width and sepal length on the x and y axes, with each species represented by a distinct D3 symbol shape. The built-in axes provide scale context, and the plot adapts to the window size. It uses D3's `scaleLinear` for positioning, `scaleOrdinal` to assign symbols from the `symbols` set, and `symbol()` to generate the paths for each data point. The code loads the dataset via `csv` and applies the reusable scatter plot module through a chained `.call()` method.

NNikitha123171

92% match

Loading thumbnail…

Fork of Reusable D3 Scatter Plot

This fork of a reusable D3 scatter plot visualizes the Iris dataset, plotting petal width against sepal length. It uses D3 v6 APIs including `scaleLinear`, `scaleOrdinal`, `axisLeft`, and `axisBottom`, with data loaded via `d3.csv`. Each species is encoded by a different symbol from the `symbols` range, generated using `symbolGenerator.type()`. The chart is rendered as SVG, fills the viewport, and includes labeled axes with custom font styling.

Rradhadevarapu

92% match

Loading thumbnail…

Fork of Reusable scatter plot with different symbols

This scatter plot visualizes the Iris dataset, showing the relationship between petal width and sepal length for three species. The plot encodes species identity through distinct D3 symbols, including a custom square symbol, and uses D3’s `scaleLinear` for axes and `scaleOrdinal` for symbol mapping. Data is loaded via `d3.csv` and rendered as SVG paths, with axes generated using `axisLeft` and `axisBottom`.

Pprachow

92% match

Loading thumbnail…

Fork of Reusable scatter plot with different symbols

This scatter plot visualizes the Iris Dataset, mapping petal width against sepal length. Each species of iris is represented by a distinct symbol, as determined by the `symbolValue` function. The visualization is built with D3.js, using the `scaleLinear`, `scaleOrdinal`, `axisLeft`, `axisBottom`, and `symbols` APIs. Data is loaded from a remote CSV file, and the plot is rendered as an SVG element, sized to fill the browser window. Axes and marks are generated via D3's join operation.

SSaivignesh-9176

92% match