Skip to main content
SimilarExport ZIP
100%

Firoze_T9_Q1

✓ Published0🌍 Public
Sshaikfiroze186@gmail.com
Last edited Apr 21, 2024
Created on Apr 21, 2024

This example shows the distribution of ice cream flavors by sales as an interactive pie chart. It uses D3.js v7 to fetch a CSV file from a GitHub gist, parse the data, and aggregate flavor counts. The visualization employs `d3.pie`, `d3.arc`, and `d3.scaleOrdinal` with a categorical color scheme to render the chart and its legend.

AI-generated description

Pie chart creation

MIT Licensed

Similar vizzes

Loading thumbnail…

firoze_Q1

This example displays the distribution of ice cream sales as a pie chart, with each slice sized proportionally to its sales category and accompanied by a legend. It uses D3 v7, loaded via UNPKG, to generate an SVG graphic with the `d3.arc()` and `d3.pie()` functions for the chart layout. The page renders static, pre-defined data without interactivity, and styles the container, SVG, and legend items using a separate CSS file. The legend is built dynamically with DOM elements to match the chart’s color-coded slices.

Sshaikfiroze186@gmail.com
90% match
Loading thumbnail…

Firoze Piechart

This example shows a pie chart of daily activities and their percentage shares, with hovering over each slice revealing the activity name and value via a tooltip. It loads a CSV dataset from a GitHub repository and uses D3 v7 APIs including `d3.csv`, `d3.pie`, and `d3.arc` to compute and draw the arcs. The chart is rendered as SVG within a fixed-size container, with colors assigned from `schemeCategory10` and no sorting applied to the data order.

Sshaikfiroze186@gmail.com
80% 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
79% match
Loading thumbnail…

ICE7-q2

This example shows the distribution of cosmetics brand stock as a pie chart, with each slice labeled directly on the chart and an interactive legend to the side displaying brand names and total values. It uses D3.js v7 with SVG rendering, loading CSV data from a GitHub Gist via `d3.csv`. The chart employs `d3.pie` and `d3.arc` to generate slices, `d3.scaleOrdinal` with `d3.schemeTableau10` for color encoding, and `d3.group` with `d3.sum` to aggregate stock values by brand.

Ppashamsahithi2391@gmail.com
79% 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
79% 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
79% match
Loading thumbnail…

Firoze_pchart

This example shows the distribution of Formula 1 car brands as a pie chart, with each slice labeled by its percentage of the total. The chart uses a categorical color scale and includes a legend, title, and axis labels. Built with D3 v6, it loads CSV data, applies the d3.pie and d3.arc generators to compute and draw the arcs, and uses d3.scaleOrdinal with schemeCategory10 for coloring. Percentage labels are positioned using arcGenerator.centroid, with SVG rendering throughout.

Sshaikfiroze186@gmail.com
78% 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
78% match