PIE-CHART

100%

✓ Published0🌍 Public

Last edited Oct 27, 2025

Created on Oct 27, 2025

A donut chart displays the distribution of Spotify listening weeks into three buckets based on skipped songs: low (≤5), medium (6–10), and high (≥11). The visualization uses d3.pie, d3.arc, and d3.scaleOrdinal to render slices with percentage labels, leader lines, and a legend. Data is loaded from a Gist-hosted CSV file using d3.csv, and the chart is rendered as an SVG. The component is reusable, with setters for width, height, and radii.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Spotify_PieChart

A donut chart visualizes Spotify listening habits by bucketing weekly skipped-song counts into Low (≤5), Medium (6–10), and High (≥11) categories, using a reusable `pieChart` module. The SVG renders slices via D3’s `pie` and `arc` generators, with leader lines, percentage labels, and a legend. Data comes from a CSV Gist, parsed and aggregated in `index.js`. The component exposes setters like `.width()`, `.data()`, and `.valueAccessor()` for customization, and uses a Tableau 10 color scale for slice fills.

Cchandanamahesh0215@gmail.com

92% match

Loading thumbnail…

Fork of Pie Chart Artistes

A donut chart displays the distribution of music genres by percentage, with each slice labeled and colored distinctly. The visualization uses D3.js to load CSV data and render an SVG, employing `d3.pie` and `d3.arc` for the donut geometry, `d3.scaleOrdinal` with a custom color range, and d3-scale-chromatic for color handling. Hovering over a slice reveals a tooltip showing the precise percentage, calculated with `d3.sum`, while mouse events and CSS transitions manage tooltip visibility.

AAnissa Belkelfa

81% match

Loading thumbnail…

Pie Chart Artistes

A donut chart breaks down music genres by count, with each slice labeled and colored to show the proportion of artists per category. The visualization uses D3’s `pie` and `arc` generators to compute slice geometry and paths, while `scaleOrdinal` maps genre names to a custom color palette from `d3-scale-chromatic`. Hovering over a slice reveals a tooltip with the exact percentage, calculated using `sum` over the CSV data. The code reads from `data.csv` and renders the chart as SVG elements with mouseover and mouseout event handlers.

AAnissa Belkelfa

81% match

Loading thumbnail…

piechart

This visualization displays the genre distribution of Spotify’s Top 50 songs as a pie chart, with percentage labels on each slice and a color-coded legend. It loads CSV data via `d3.csv`, aggregates counts with `d3.rollup`, and renders SVG paths using `d3.pie` and `d3.arc`. The chart applies a Tableau10 color scheme from `d3.scaleOrdinal` and positions text labels at arc centroids.

Sshivadeclare2@gmail.com

81% match

Loading thumbnail…

Assignment2-1

A pie chart visualizes the distribution of Spotify's Top 50 songs from 2019 by genre. It fetches CSV data from a GitHub gist, uses `d3.rollup` to count songs per genre, and computes percentages for labels on each slice. The chart renders as SVG, using `d3.pie` and `d3.arc` for the sectors, a categorical color scheme, and includes a legend positioned to the right. A bold title and percentage labels are added directly on the arcs.

Sshivadeclare2@gmail.com

78% match

Loading thumbnail…

ice7_task2_1

A dark-themed pie chart shows the distribution of total monthly Spotify listeners across music genres, with each slice sized by summed listener counts from the SpotifyTopArtists.csv dataset. D3 v7 loads the CSV with `d3.csv`, aggregates genres using `d3.rollup` and `d3.sum`, and renders the chart with `d3.pie` and `d3.arc` generators. Slice labels display genre names and percentages via `tspan` elements, while a side legend built with D3 DOM joins shows each genre's total listeners in millions.

BBalaji Dasari

77% match

Loading thumbnail…

subahsh_PieChart

This pie chart visualizes YouTube channel analytics, categorizing weeks by watch time into low, medium, and high buckets based on data-driven quantiles. It uses D3.js version 6.7.0, loading CSV data and employing the reusable `pieChart()` function with configurable dimensions, inner radius for a donut style, and a legend. The chart displays labels and a legend title, rendering the distribution of weekly watch time hours through an SVG.

SSubhash

77% match

Loading thumbnail…

Pie chart

This pie chart example shows a donut-shaped chart with a solid orange center, rendered as an SVG using D3 v5. The chart displays four data segments (10, 20, 30, 60) with a color scale based on `d3.scaleOrdinal`, while radio buttons allow switching between apple and orange datasets (though only the orange dataset is actively rendered). The visualization uses `d3.arc()` to generate both the outer ring and inner circle paths, with the chart positioned at three-fifths of the SVG height.

JJoachimSchaeffer

76% match