Pie_chart_ice_7

100%

Pie_chart_ice_7

✓ Published0🌍 Public

Last edited Jul 2, 2022

Created on Jul 2, 2022

This pie chart displays the top 10 company valuations in billions from a CSV dataset. The chart uses a D3.js v5 SVG rendering, with each slice colored via a custom `sectionColors` array and labeled with its value using `d3.pie` and `d3.arc`. A legend to the right maps company names to their respective colors and values. The data is fetched asynchronously from a GitHub gist, and the visualization is generated using `d3.scaleOrdinal` for color assignment and `d3.arc().centroid()` for text placement, all within an HTML page styled with CSS.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

ICE-7 Fork of Pie Chart

This visualization shows the profit percentages of various companies using a pie chart, with a legend to the right mapping colors to company names and exact values. The chart is built with D3 version 5, rendering as SVG elements on an HTML canvas. It loads company and profit data from a remote CSV file using `d3.csv`, then applies the `d3.pie` layout and `d3.arc` path generator to create the slices. Color encoding is handled by `d3.scaleOrdinal` with a predefined palette. Profit values are formatted using `d3.format` for display in the legend.

Kkarumanchimanasa

84% match

Loading thumbnail…

ICE-7 PieChart

This pie chart visualizes the net worth of the top 10 billionaires, with each slice labeled with its value in billions and accompanied by a legend listing names and amounts. The code loads CSV data via `d3.csv`, converts values to numbers, and uses `d3.pie` and `d3.arc` to generate SVG paths. Color mapping relies on `d3.scaleOrdinal`, while labels and legends are appended as SVG text and rect elements.

VVamsi Krishna

84% match

Loading thumbnail…

ICE-7 PieChart 11590101

This pie chart visualizes the net worth of the top 10 billionaires, with each slice labeled by its dollar value and accompanied by a legend listing names and amounts. The code uses D3 v5 APIs including `d3.pie()`, `d3.arc()`, and `scaleOrdinal` to generate SVG paths, with data fetched as CSV from a Gist. Slice labels are positioned using `arc.centroid()`, and a linear-gradient background is applied via CSS.

DDivyasri0310

83% match

Loading thumbnail…

Pie Chart

This pie chart displays the sales figures of various companies, with each slice sized proportionally and labeled with its value in thousands. It also includes a color-coded legend listing company names and corresponding sales amounts. The visualization uses D3 v5 APIs including `pie`, `arc`, `scaleOrdinal`, and `format` to generate the SVG segments and text, with data loaded via `csv` from a GitHub gist. Colors are assigned through a custom ordinal scale.

TTejaswi@3271

82% match

Loading thumbnail…

pie chart

This pie chart visualizes the prices of the top 11 products from a CSV dataset, sorted in descending order and drawn as SVG arcs. Built with D3.js v5, it uses the `pie` and `arc` functions to generate segments, `scaleOrdinal` with `schemeCategory10` for color coding, and includes an interactive legend showing each product name and its price in dollars. Data is loaded asynchronously via `csv` from a GitHub gist, and the chart is rendered on mouseover logging.

Aadapavaishnavi12

82% match

Loading thumbnail…

ICE-7 BALAJI PIE CHART

This pie chart visualizes company metrics by aggregating the total values of six distinct fields—Revenue, Profit, Customers, Expenses, EmployeeCount, and Productivity Index—from a CSV file fetched from a GitHub gist. The data is loaded using `d3.csv`, and the sums are calculated with `d3.sum`. The chart is rendered as an SVG, using `d3.pie` to generate the arc data and `d3.arc` to draw each sector, which are then colored with `d3.scaleOrdinal` and the `d3.schemeCategory10` palette. Text labels are positioned at each arc’s centroid.

Ppeddubalaji@gmail.com

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

81% match

Loading thumbnail…

Untitled

This example presents a pie chart of company values, with each slice labeled by company name and value. The chart uses D3 version 3 to load CSV data and generate the pie layout, with an ordinal color scale assigning distinct colors to each company. A custom legend, built using a reusable `d3.legend` function, displays each slice’s label and color in a boxed list beside the chart. The visualization is rendered as SVG, with text labels placed at each arc’s centroid.

Ssri7harsha

81% match