Skip to main content
SimilarExport ZIP
100%

Fork of Pie Chart

✓ Published1🌍 Public
Ssowmyanagula@my.unt.edu
Last edited Mar 26, 2022
Created on Mar 26, 2022
Forked from Hello VizHub

This fork of a pie chart visualizes 2015 sales data for different companies using a legend and colored arcs. The chart displays each brand’s year-to-date profit converted to thousands and rendered as a simple SVG pie. The code imports D3 v5 modules like `pie`, `arc`, and `scaleOrdinal` to generate the chart, while loading data from a CSV via D3’s `csv` function. React is used as the framework, and the page is styled with custom CSS for headings and legend text.

AI-generated description

A bare minimum HTML page demonstrating use of CSS and JavaScript.

See also React Starter.

MIT Licensed

Similar vizzes

Loading thumbnail…

piechartfork

A pie chart displays the 2015 sales for different companies, with each slice colored and labeled in a legend alongside its total value. The visualization uses D3 v5’s `pie` and `arc` functions to generate the SVG segments, with `scaleOrdinal` assigning colors from a fixed palette. Data is loaded asynchronously via `d3.csv` from a gist, and the chart is rendered within a React-based HTML page, with legend text and values formatted using `d3.format`.

SSnigdha6698
92% match
Loading thumbnail…

Fork of Fork of ICE - 7 Pie Chart FOR MARkS

A pie chart visualizes company profits from a CSV dataset, encoding each company's profit value as a colored slice with a text label showing the profit amount. The legend lists company names alongside their corresponding colors and profit values. Built with D3 v5 in a React context, the code uses `d3.pie`, `d3.arc`, `d3.scaleOrdinal`, and `d3.csv` to fetch and render the SVG, with pie slices positioned via `arc.centroid` and legend items generated dynamically.

Kkarumanchimanasa
87% match
Loading thumbnail…

Fork of Fork of HTML Starter

This example shows a pie chart of YTD sales by brand, with a legend displaying each brand's share as a percentage and a value in thousands. The visualization is built with D3 v3, using `d3.pie` to generate segment data, `d3.arc` for path construction, and `d3.scaleOrdinal` for categorical colors. Data is loaded asynchronously from an external source via a helper function `getData`, and the chart renders with a fixed SVG viewport.

Eeravellisaimeghana
86% match
Loading thumbnail…

Fork of Pie Chart

This example visualizes state sales data as a pie chart, with each slice colored by total sales value and a corresponding legend listing state names alongside their formatted dollar amounts. The top ten states by sales are shown, sorted in descending order. Built with React and D3 v5, it uses d3.pie, d3.arc, and d3.scaleOrdinal to generate SVG paths, while d3.csv loads the external dataset from a GitHub gist. Mouseover events log slice data to the console, and all rendering occurs within an SVG container.

NNeeharikaGali
85% 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
84% match
Loading thumbnail…

Pie Chart

This example displays a pie chart of sales figures for different companies, with each segment labeled by its proportional value and paired with a legend showing company names and sales totals. The chart is rendered as SVG using D3 v5, with data fetched from a CSV URL. It uses D3’s `pie` and `arc` generators to create the segments, a `scaleOrdinal` to map sales values to a set of predefined colors, and custom text elements to label each slice.

Mmanvithareddykarra
84% match
Loading thumbnail…

Fork of Pie Chart

This visualization displays the revenue of the top 20 makeup products using a basic pie chart with a legend to the right. The chart uses D3 v5's `pie` and `arc` generators to create the segments and `scaleOrdinal` with `schemeCategory10` for color encoding. Data is loaded from a CSV file via `d3.csv`, then sorted descending by revenue and sliced to the top 20 items. The SVG includes interactive mouseover logging and legend labels showing product names and dollar-formatted revenue values.

Aadapavaishnavi12
84% match
Loading thumbnail…

Fork of Pie Chart

This fork of a pie chart visualizes 2022 US auto sales by brand, showing each brand’s year-to-date sales as a colored arc with a legend listing brand names and scaled values (in thousands). The chart uses D3 v5’s `pie` and `arc` generators to compute segment angles and paths, with `scaleOrdinal` mapping sales values to a fixed color palette. Data is loaded asynchronously from a CSV file via `d3.csv`, and the SVG is rendered with appended `path` and `rect` elements. The legend and chart are positioned using SVG transforms.

Ppravallikayaram12
84% match