Fork of Fork of Scatter Plot with Shape

Jjasthilavanya2022@gmail.com

Fork of Fork of Scatter Plot with Shape

This example uses the Iris flower dataset to display a scatter plot of sepal length against petal length, with each of the three species differentiated by a distinct symbol shape. The visualization separates the axes and legend into reusable modules, employing D3’s `scaleOrdinal`, `symbolsFill`, and `symbolGenerator` to render the shapes. A custom legend component maps each species to its corresponding glyph, while the chart updates asynchronously after fetching and parsing the CSV data with `csvParse`. The code relies on D3 v7 APIs including `axisLeft`, `axisBottom`, and `scaleLinear`.

Llikhithakarunakarreddym@gmail.com

Fork of Fork of Scatter Plot with Shape

This example displays the classic Iris dataset as a scatter plot, mapping sepal length to the x-axis and petal length to the y-axis with D3 v7 scales. Each species is distinguished by a unique symbol from `d3.symbolsFill`, such as circles or triangles, through an ordinal scale. The visualization includes labeled axes and a custom shape legend built with D3’s `symbol` generator. Data is loaded via `fetch` and parsed with `d3.csvParse`, then rendered inside an SVG using modular functions for axes, plotting, and the legend.

Fork of Scatter Plot with Shape

This example uses a D3 v7 scatter plot to visualize the Iris flower dataset, mapping sepal length to the x-axis and petal length to the y-axis. The three species are distinguished by different symbol shapes from d3.symbol, rendered with `symbolGenerator.type()` and a `scaleOrdinal` mapping to `symbolsFill`. A custom legend, built with the shapeLegend module, displays the species-to-shape correspondence, while the axes module adds labeled axis scales via `d3.axisLeft` and `d3.axisBottom`. Data is fetched as CSV and parsed with `d3.csvParse`, with numeric values converted before plotting.

Iindushashi.g@gmail.com

Fork of Scatter Plot with Shape

This example visualizes the Iris dataset as a scatter plot of sepal length versus petal length, with symbols distinguishing iris species. It uses D3 v7 APIs including `scaleLinear`, `scaleOrdinal`, `symbolsFill`, and `symbol` to draw shapes, plus custom modules `axes.js` and `shapeLegend.js` for labeled axes and a legend. The CSV data is loaded via `fetch`, parsed with `csvParse`, and numeric fields are coerced before rendering.

Lleftymadi

Vvenkatdinesh5010@gmail.com

Fork of Fork of Scatter Plot with Shape

This scatter plot visualizes the Iris dataset, mapping sepal length against petal length for three species. Each species is represented by a distinct symbol shape, with a legend showing the mapping between the categorical species variable and the corresponding shape. The visualization uses D3 v7, employing `scaleLinear` for the axes, `scaleOrdinal` with `symbolsFill` for shape encoding, and custom modules for axes and legend rendering. Data is loaded from a remote CSV file and parsed using `csvParse`.

Fork of Fork of Scatter Plot with Shape

This example visualizes the Iris dataset as a scatter plot of sepal length against petal length, with each point’s symbol shape encoding the flower’s species. It uses D3 v7’s `scaleLinear` for axes, `scaleOrdinal` plus `symbolsFill` to map species to differing symbol shapes, and `symbol().size(200)` to render point marks. A shape legend, built with a custom `shapeLegend` function, lists species names alongside their corresponding symbols. The plot is rendered into an SVG sized to the window, with axes and labels created via D3’s `axisLeft` and `axisBottom`.

LLakshmi Keerthi

Ccharanshiva769@gmail.com

Fork of Fork of Scatter Plot with Shape

This example shows the classic Iris dataset as a scatter plot, mapping sepal length to the x-axis and petal length to the y-axis, with each of the three species distinguished by a unique D3 symbol shape. A legend identifies the species shapes, while labeled axes provide context for the measurements. The visualization is built with D3 v7, using `d3.scaleLinear` for axes, `d3.scaleOrdinal` with `d3.symbolsFill` for shapes, and modularized functions for rendering axes, the shape legend, and scatter plot marks. The data is loaded as CSV and parsed with `d3.csvParse`.

Fork of Fork of Scatter Plot with Shape

This interactive scatter plot displays the Iris dataset, mapping sepal length against petal length while encoding species through distinct symbol shapes. The visualization uses d3.scaleLinear for both axes and d3.scaleOrdinal with d3.symbolsFill to assign unique geometric markers to each species. A custom legend, built with d3.symbol, explains the shape-to-species mapping. The code leverages d3.csvParse to load remote data and d3.axisLeft/axisBottom for labeled axes, with axes and legend implemented as reusable functions.

Aabjalshaik02@gmail.com