ICE7

100%

✓ Published0🌍 Public

Last edited Mar 29, 2026

Created on Mar 29, 2026

This interactive pie chart visualizes the distribution of the top 10 programming languages of 2024, with each slice’s size proportional to its usage percentage and a legend on the right listing each language with its exact value. Built as a reusable chart function using the `d3.pie` layout and `d3.arc` generators, it assigns categorical colors via `d3.scaleOrdinal` and `d3.schemeTableau10`. The React application loads the CSV dataset and renders the SVG to fill the browser window, labeling slices with values above 3%.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

ice_7

This example presents a top-10 programming languages chart as an interactive scatter plot, showing the 2024 market share percentages from `data.csv`. Each language is a black circle positioned on an x/y grid; clicking a circle turns it white with a black outline. The visualization uses React with D3 v7, employing `renderCircles` with `scaleLinear` for axes and click handlers for selection. An SVG pie chart with a legend is also available via `pieChart`, using `pie` and `arc` with `scaleOrdinal` and `schemeTableau10` for coloring.

Vvarshitreddy02@gmail.com

91% match

Loading thumbnail…

ICE7.2

This pie chart visualizes the frequency distribution of letters from a truncated dataset, with each slice colored and labeled by its corresponding letter. The visualization uses D3 v3’s `d3.layout.pie` and `d3.svg.arc` to compute and render the arcs, while `d3.scale.ordinal` assigns a categorical color range. Data is loaded as CSV from a GitHub gist, with frequency values parsed as numbers, and the SVG is centered within a 900x400 viewport.

BBryanA999

87% match

Loading thumbnail…

ICE-7 Varunpie

This visualization presents a pie chart of the top 10 most frequent math scores from a dataset loaded via `d3.csv`. It shows the distribution of these scores by count, with a legend displaying each score and its frequency. The code uses `d3.pie()` and `d3.arc()` to generate the SVG slices, with `d3.schemeCategory10` providing a custom color palette. The chart is rendered with `d3.v7` in an HTML page, fetching data from a GitHub gist URL.

VVarun Gadde

86% match

Loading thumbnail…

ICE7 Pie Chart

This pie chart visualizes the market share of popular JavaScript frameworks, including Vue, ReactJS, and Angular, based on values loaded from a CSV file. The chart displays each framework’s percentage via colored arcs and includes a legend with labels and values. Built with D3 v5 and React, it uses `d3.pie()` to compute arc angles, `d3.arc()` to draw SVG paths, and `scaleOrdinal` for color mapping, rendering the result as an SVG graphic.

Ggeethikal

86% match

Loading thumbnail…

Fork of ICE-7 Languages In Pie Chart : Shreeti

This example visualizes language use in India as an interactive pie chart, with counts shown in millions. The chart uses a d3.pie layout and d3.arc to generate SVG paths, with a color scale from d3.schemeCategory20c. Hovering over a slice triggers a tooltip that displays the language label, count, and percentage, calculating the percentage based on enabled data entries. The dataset is loaded from an external CSV URL, and the rendering includes SVG elements with animation support for smooth transitions.

Ssitaramchallapalli

85% match

Loading thumbnail…

ICE7

This pie chart visualizes export values across different years. It loads CSV data from a GitHub gist and renders an SVG donut chart using D3 v5’s `pie` and `arc` generators, with `scaleOrdinal` for section colors. Labels display formatted values via `format`, and a legend lists each year with its corresponding value.

Ssugunagar

85% match

Loading thumbnail…

ICE:7 Fork of Pie Chart

A pie chart displays the top ten most populous countries in 2020, with each slice sized by population and a legend listing each country alongside its population in millions. The visualization loads CSV data from a GitHub gist via `d3.csv`, then uses `d3.pie` and `d3.arc` to generate SVG paths, with `d3.scaleOrdinal` assigning a distinct color to each slice. A separate legend group renders colored rectangles and text labels using `d3.select` and data joins, while `d3.format` converts raw numbers into readable millions values.

Mmanasanimmagadda13

84% match

Loading thumbnail…

ICE 7 PIE CHART

This pie chart visualizes the populations of the top 10 countries in 2022, with each slice labeled with its population value and accompanied by a color-coded legend. It uses D3 v5 APIs including `pie()`, `arc()`, `scaleOrdinal()`, and `format()` to generate the SVG paths, slice labels, and legend. The data is loaded asynchronously from a CSV via `d3.csv()`, and the chart is rendered with an inner radius of zero and an outer radius of 175 pixels, centered at (250,250) in an SVG canvas.

SSreejaBellamkonda

84% match