Skip to main content
SimilarExport ZIP
100%

Fork of ICE-7.2 - Vinil

✓ Published0🌍 Public
VVinil Karmilla
Last edited Mar 30, 2026
Created on Mar 30, 2026
Forked from ICE-7 - Vinil\

This example shows a pie chart of category sales from a CSV file, with each slice labeled and a legend displaying category names and values. Using d3.pie and d3.arc, it generates SVG paths for the pie slices, colored via d3.scaleOrdinal with d3.schemeTableau10. Text labels are positioned with d3.arc centroids, and a legend is built by appending rectangles and text to the SVG.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of ICE - 7 Pie Chart

This example shows the percentage sales of different items in a pie chart, with a legend displaying each item’s name and corresponding value. Built with D3 v5, it loads data from a CSV hosted on GitHub, converts sales values to numbers, and uses `d3.pie()` and `d3.arc()` to generate the SVG path segments. Colors are assigned via `d3.scaleOrdinal`, while the legend is manually created with appended rectangles and text. The chart is rendered entirely in SVG, with a fixed width and height, and no interactive behavior.

MMar-99
90% match
Loading thumbnail…

Fork of ICE - 7 Pie Chart

This example shows the percentage of sales for different items using a pie chart with a color-coded legend. The chart is rendered as an SVG, with each slice’s arc and fill color generated via `d3.arc()` and `d3.scaleOrdinal()`. Data is loaded asynchronously from a CSV URL using `d3.csv`, and the legend displays each item’s name and sales percentage, formatted with `d3.format`. The visualization relies on D3 v5 and a custom `bundle.js`, with the pie layout computed by `d3.pie()`.

MMar-99
89% match
Loading thumbnail…

ICE-7

A pie chart visualizes sales by category from a CSV dataset, using d3.csv to load values. The SVG graphic displays category labels on each slice via d3.arc and a legend on the right. D3 v7’s pie generator computes the arc angles, while d3.scaleOrdinal with schemeTableau10 assigns colors. The code uses `d3.pie()` and `d3.arc()` to generate paths, with tooltips added as titles, and a legend built from rectangles and text elements.

Aankitgoudpoodhari07@gmail.com
88% match
Loading thumbnail…

Fork of Fork of ICE-7 pie chart

This pie chart visualizes the number of car units sold, categorizing the data by class name and assigning each segment a distinct color from a predefined palette. The chart renders as an SVG with arcs generated using d3.arc and positions data through d3.pie, while d3.scaleOrdinal maps colors to categories. A legend on the right displays each class with its corresponding color and formatted value using d3.format. Data is loaded asynchronously from a CSV file via d3.csv.

Llikith1266
87% match
Loading thumbnail…

Fork of ICE - 7 Pie Chart

This pie chart displays the percentage of sales for different items, with a legend positioned to the right showing each item’s name and corresponding value. The chart is built with D3 v5, using `d3.pie` and `d3.arc` to generate the segments, `d3.scaleOrdinal` for color mapping, and `d3.csv` to load the dataset from a GitHub gist. The visualization renders as SVG, with section labels and legend text styled via CSS.

RRahulSai05
86% match
Loading thumbnail…

Fork of Fork of Fork of ice7_3

This pie chart displays revenue distribution by category, with slices labeled directly and a legend to the right. Built with D3 v7, it loads CSV data from a GitHub gist, aggregates revenue using d3.rollup and d3.sum, and renders SVG paths via d3.pie and d3.arc. A d3.scaleOrdinal with the Tableau10 color scheme maps categories to colors, while text elements label each slice.

Kkanaparthieshitha@gmail.com
86% match
Loading thumbnail…

Fork of Fork of ice-7 q2

This example displays a pie chart with labeled slices, where each slice’s color corresponds to a categorical label and its size reflects a numeric value. The visualization is rendered as static SVG using D3.js v6, with the chart centered in a 500×500 viewport and slice labels placed at each arc’s centroid. Data is loaded asynchronously from a remote JSON file via `d3.json`. The chart uses `d3.pie` to compute arc segments, `d3.arc` for path geometry, and `d3.scaleOrdinal` with `d3.schemeCategory10` to assign colors.

Bbhargavinalamothu@gmail.com
86% match
Loading thumbnail…

Fork of ICE - 7 Pie Chart

This gallery example presents a pie chart visualizing sales percentages for different items, sourced from a CSV dataset by Ramyapriya Putta. The chart uses D3 v5’s `pie()` and `arc()` generators to render SVG paths, with categorical colors assigned via `scaleOrdinal`. A legend, built with appended rectangles and text, labels each item and its percentage using `format('.4~g')`. The visualization iterates through the data asynchronously via `d3.csv`.

Eeravellisaimeghana
86% match