Pie Chart

100%

✓ Published1🌍 Public

Last edited Mar 30, 2026

Created on Mar 30, 2026

This pie chart displays the percentage distribution of global internet traffic by device, including smartphones, desktop computers, tablets, and smart TVs. It uses D3.js v7 to load data from a CSV file and render the visualization as an SVG. The chart employs `d3.pie()` and `d3.arc()` to generate slices, with labels positioned using a secondary arc generator. A legend on the right uses `d3.scaleOrdinal` with the `schemeTableau10` color palette to map categories to colors.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

PIE CHART

This pie chart visualizes global internet usage rates by country, with each slice sized proportionally to the internet user rate and colored via a categorical scale. Hovering highlights a slice and displays a tooltip with the country name and rate, while a legend lists all countries. Built with D3 v5, it loads CSV data from a GitHub gist and renders the chart as SVG using the `pie` and `arc` generators, with `scaleOrdinal` for colors.

DDeegutla123

81% match

Loading thumbnail…

Pie chart

This pie chart displays browser market share percentages, with each slice colored via a categorical scale and a legend identifying the browser names. It uses D3 v7 with `d3.pie` and `d3.arc` to generate the SVG paths, and `d3.csv` to load the remote dataset. Hovering over a slice reveals a tooltip showing the browser and its exact share, while the chart includes a bold title and white stroke separators between slices.

Vvenkatamanikantavaddi@my.unt.edu

80% match

Loading thumbnail…

7-q1

This pie chart shows the distribution of mobile device types from a CSV dataset sourced from GitHub, displaying each device model’s count as a labeled slice with a legend. It uses D3.js v7 APIs including `pie()`, `arc()` for SVG path generation, `scaleOrdinal` for color mapping, and `csv()` for data loading. The code aggregates raw records by device model, then renders colored arcs with count labels and a legend, all within an SVG container styled with an external stylesheet.

Nnikhithaaitha22@gmail.com

78% match

Loading thumbnail…

Activity 7: Pie Chart

This pie chart visualizes the distribution of smartphone categories from a CSV dataset. The visualization uses D3.js (v7) to compute slice arcs with `d3.pie()` and renders them as SVG paths using `d3.arc()`. A color scale from `d3.scaleOrdinal(d3.schemeTableau10)` distinguishes categories, while a legend and axis labels clarify the data. The chart also includes tooltips with category names and counts.

Oorusushanth2002@gmail.com

77% match

Loading thumbnail…

pie chart

A pie chart displays website traffic sources with visitor counts for each source. The visualization loads CSV data using d3.csv from d3.v7, then renders it on a Canvas element via the Chart.js library. Each slice uses a distinct background color with white borders, and the legend appears on the right side. The chart title indicates traffic values in thousands, while the responsive layout adapts to the container size.

UUday Kiran

77% match

Loading thumbnail…

PIECHART-SUBHASH

This D3.js donut chart example, PIECHART-SUBHASH, displays device share percentages (e.g., mobile, desktop, tablet) as colored slices with rounded corners and padding. It shows percentage labels outside the donut, connected by leader lines, alongside a legend on the right. The code builds a reusable pie chart component using `d3.pie`, `d3.arc`, and `d3.scaleOrdinal` with a Tableau10 palette, rendering to SVG via the D3 `.join()` pattern. The chart uses hardcoded demo data and supports configurable inner radius, corner radius, and label formatting.

SSubhash

77% match

Loading thumbnail…

Pie Chart

This pie chart visualizes the percentage breakdown of nutritional components, such as carbohydrates, proteins, and fats, using interactive slices with hover effects that display exact values via tooltips. A legend on the right side highlights corresponding slices when hovered, dimming non-related arcs. Built with D3 v7, the chart uses the `pie` and `arc` functions to generate the layout and `scaleOrdinal` with `schemeTableau10` for colors. Transitions and opacity changes create a smooth, interactive experience for exploring the data.

Ttejasviteegala@my.unt.edu

77% match

Loading thumbnail…

Learn pie chart with D3.js

This pie chart visualizes worldwide operating system market share for Android, Windows, and iOS, using percentage values from the displayed data array. The D3.js v4 code creates an SVG-based pie chart by applying `d3.pie` to the data, drawing arcs with `d3.arc`, and coloring each slice via `d3.scaleOrdinal` with the `schemeCategory10` palette. Labels for each platform and its percentage are placed at arc centroids. The chart is rendered within a 500×300 SVG canvas, with the data sourced from the provided JavaScript object.

Aaruba-haroon

77% match