ICE-7 SAKETH SARA PIE

100%

ICE-7 SAKETH SARA PIE

✓ Published0🌍 Public

Last edited Oct 27, 2025

Created on Oct 27, 2025

This example shows a donut-style pie chart of product sales loaded from a CSV file, with an ordinal color scale and a legend. Built with D3 v7, it uses `d3.pie()` and `d3.arc()` to generate the slices, while `d3.scaleOrdinal()` and `d3.schemeTableau10` assign colors. Tooltips appear on mousemove over each arc, and labels display for products with sales values above 90. The chart is rendered as SVG within an HTML page, styled by a linked stylesheet.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

PIE - ICE 7 SAKETH SARA

This pie chart visualizes annual sales share by product category, with each slice labeled by product name and percentage of total sales. The visualization uses D3.js v7’s `d3.pie()` and `d3.arc()` generators to compute and draw the arcs, while `d3.scaleOrdinal` with the Tableau10 color scheme assigns distinct colors to each product. Data is loaded from a remote CSV file via `d3.csv`, and the chart includes labeled polylines connecting slices to text annotations, plus a legend for quick reference.

Ssarasaketh3@gmail.com

90% 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

89% match

Loading thumbnail…

ICE 7

This pie chart visualizes sales by category, displaying five segments for electronics, furniture, clothing, and toys. The chart uses D3.js v7 to load the sales.csv dataset, then applies `d3.pie()` and `d3.arc()` to compute slice geometries, with `d3.scaleOrdinal` and `d3.schemeTableau10` assigning colors. It renders as SVG with category labels positioned via `labelArc.centroid()` and includes a legend showing each category and its value. Hovering over a slice reveals a tooltip with the category name and numeric value.

Aankitgoudpoodhari07@gmail.com

87% match

Loading thumbnail…

ICE 7 Saranya

This example displays a donut chart of aggregated sales data, with each arc labeled by its total value and a legend identifying categories. The visualization also includes tooltips on hover and uses opacity to differentiate segments. Built with React and D3 v2, it loads CSV data and processes it through a custom `TransformChartData` function to sum values by category. The chart is rendered as an SVG using `d3.layout.pie` and `d3.svg.arc`, with color mapping via `d3.scale.ordinal` and interactive legend elements.

MMalempatiSaranya

86% match

Loading thumbnail…

ICE-7 PIE Chart

This example shows the sales of various fruits as a D3 pie chart with a corresponding legend. The chart uses d3.csv to load data from a remote GitHub gist, then d3.pie and d3.arc to compute and draw the slices. A d3.scaleOrdinal maps sales values to a hardcoded color palette. The legend displays each fruit name and its sales total formatted with d3.format. The SVG rendering approach is used throughout, with the chart centered and the legend positioned to the right.

RRadhakrishna246

86% match

Loading thumbnail…

ICE - 7 Pie Chart

This example displays the percentage of total sales for different items in a pie chart using D3 v5. The code loads CSV data from a GitHub gist and renders an SVG with a pie chart and a legend, with each slice and legend entry colored by a fixed ordinal scale. It uses `d3.csv`, `d3.pie`, and `d3.arc` to compute and draw the arc segments, and `d3.scaleOrdinal` for color mapping, while formatting the percentage labels with `d3.format`.

RRamyapriyaPutta

86% match

Loading thumbnail…

ICE7 - Pie Chart

This pie chart visualizes regional sales distribution, with each slice representing a region's proportion of total sales and a legend showing region names with percentage values. The code loads sales data from a GitHub-hosted CSV using d3.csv, then renders the chart with d3.pie and d3.arc functions, applying colors via scaleOrdinal. SVG elements are appended to the page using d3.select, with legend text formatted via d3.format to display percentages. The visualization uses d3.v5 and outputs the result as scalable vector graphics.

Kkuraakhila9@gmail.com

86% match

Loading thumbnail…

Fork of ICE 7 Saranya

This example visualizes aggregated sales data as an interactive donut chart, using a pie layout to segment totals across categories. The visualization is rendered in SVG with D3.js v2 within a React framework, employing `d3.layout.pie` and `d3.svg.arc` to compute arc paths. Hovering over or clicking legend items provides additional context through SVG titles. The data originates from an ICE7.csv file, and the chart includes value labels placed via `arc.centroid`. Color encoding uses an ordinal scale with a pre-defined color range, and the entire plot is animated and wrapped in a custom `TransformChartData` aggregation function.

Ssitaramchallapalli

85% match