Skip to main content
SimilarExport ZIP
100%

Fork of Hello VizHub

✓ Published0🌍 Public
Ssohith kampalli
Last edited Mar 24, 2025
Created on Mar 24, 2025
Forked from Hello VizHub

This pie chart displays the distribution of three Iris species in the classic dataset, with each slice labeled by species and a color-coded legend below. The visualization uses D3 v7’s `d3.pie` and `d3.arc` generators to compute slice paths, while `d3.rollup` aggregates row counts from a CSV loaded via `d3.csv`. SVG paths and text elements are rendered inside a centered group, with a separate HTML legend built from `d3.scaleOrdinal` color mapping.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Hello VizHub

This example shows the distribution of sepal lengths across Iris species using an interactive SVG pie chart. The chart displays the percentage of each species in tooltips and includes a legend. It loads the Iris dataset from a CSV URL using D3's `csv` function, then renders the visualization with `pie` and `arc` generators from the D3 6.7.0 library. The code also demonstrates importing D3 via UNPKG and using the `select` and `append` DOM methods to build the SVG.

Vvikramkotlo9@gmail.com
90% match
Loading thumbnail…

Fork of iris-pie-chart

This fork of the iris-pie-chart displays the distribution of three iris species as a pie chart with a legend. The chart uses d3.csv to load species data, d3.rollup to count occurrences, and d3.pie with d3.arc to generate and render SVG path slices. Each slice is labeled with its species name using arc.centroid, and a legend built with d3.scaleOrdinal links colors to species.

Ssohith kampalli
89% match
Loading thumbnail…

Fork of Fork of Hello VizHub Q2 vk

This example displays a pie chart from the Iris dataset, showing the distribution of petal lengths by species. Built with D3.js (version 6.7.0), it loads data from a GitHub Gist via the `d3.csv` function, transforms it, and renders an SVG. The visualization uses `d3.scaleBand` and `d3.scaleLinear` for axes, `d3.stack` and `d3.area` to create the chart, and `d3.axisBottom` and `d3.axisLeft` for tick marks. A title labeled "Petal Length Distribution" is added above the plot.

Vvikramkotlo9@gmail.com
87% match
Loading thumbnail…

Fork of Fork of Hello VizHub

This example combines a pie chart and an area chart to visualize species distribution and temporal trends. The pie chart uses d3.pie and d3.arc to show the count of iris species from a CSV file loaded with d3.text, while the area chart uses d3.area with d3.scaleTime and d3.scaleLinear to display a simple time series. Both charts include legends and axes rendered via d3.axisBottom and d3.axisLeft.

Ssravya.mundluru@gmail.com
87% match
Loading thumbnail…

Fork of Hello VizHub

This scatter plot visualizes the Iris dataset, mapping petal length and petal width for each sample while coloring points by species (setosa, versicolor, virginica). The visualization uses D3 v6 via UNPKG, loading data with `d3.csv`, scaling with `d3.scaleLinear`, and rendering axes with `d3.axisLeft` and `d3.axisBottom`. Circles are appended to an SVG, with fill colors assigned per species and petal dimensions determining x- and y-positions. The chart includes labeled axes and a fixed radius for all points, sourced from a remote CSV hosted on GitHub.

Ssusarlasruthi2000@gmail.com
86% match
Loading thumbnail…

Fork of Hello VizHub

This scatter plot visualizes the Iris dataset, mapping petal length and width on the axes and coloring each point by species (setosa, versicolor, virginica). The code loads CSV data from a remote URL using d3.csv, applies linear scales with d3.scaleLinear, and renders SVG circles positioned via d3.selectAll and .join. Axes are generated with d3.axisLeft and d3.axisBottom, while the chart dimensions adapt to the window size.

Ssaivaishnogaruda@gmail.com
86% match
Loading thumbnail…

Fork of Hello VizHub

This example shows a scatter plot of iris flower measurements, using sepal length and petal length as axes and distinct symbol shapes to encode the three species categories. The visualization includes a shape legend labeled “Species” to identify the species associated with each symbol. The code uses D3 v7 APIs such as `d3.csvParse`, `d3.scaleLinear`, `d3.scaleOrdinal`, `d3.symbol`, and `d3.symbolsFill` to render the marks, while an axes module builds the chart scaffolding with `d3.axisLeft` and `d3.axisBottom`. Data is fetched from a GitHub-hosted CSV of the classic Iris dataset.

Ssusarlasruthi2000@gmail.com
85% match
Loading thumbnail…

IRIS

This pie chart displays the distribution of Iris species from a CSV dataset loaded from a GitHub gist. The chart uses a clean, white background with an elegant color palette of blue, orange, and green to distinguish the three species, and includes labels directly on the slices, a bold title, and a legend showing counts. Built with D3.js v7, it employs `d3.pie`, `d3.arc`, and `d3.scaleOrdinal` to generate the SVG slices, with `d3.rollups` aggregating the data.

Mmyselfganesh433@gmail.com
85% match