ICE7 Pie Chart_Loki

100%

ICE7 Pie Chart_Loki

✓ Published0🌍 Public

Last edited Mar 25, 2023

Created on Mar 25, 2023

This pie chart visualizes the revenue generated by the ten most-sold beauty products, showing the proportional share of each product's sales. The chart is rendered as an SVG using D3 v5, with pie segments generated by the `d3.pie` layout and `d3.arc` for the sector geometry. Color mapping employs `d3.scaleOrdinal` with the Category10 scheme, applied to each revenue value. A legend to the right lists product names and their formatted revenue values, using `d3.format` with a `'.4~g'` pattern. Data is loaded from `Data.json`.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

ICE7 Pie Chart

This pie chart displays the revenue distribution of the ten best-selling beauty products, with proportional slices colored via d3.scaleOrdinal. The visualization loads data from Data.json, converts revenue values to numbers, and renders SVG paths using d3.pie and d3.arc. A legend, built with SVG rects and text elements, lists each product alongside its revenue formatted with d3.format.

PPlatoch

91% match

Loading thumbnail…

Fork of ICE7 Pie Chart

This pie chart displays the revenue distribution for ten beauty products, with each slice sized proportionally to its sales value and colored using the `d3.scaleOrdinal` scheme. A legend on the right lists product names and their formatted revenue values using `d3.format`. The visualization uses `d3.pie` and `d3.arc` to generate SVG paths from the JSON dataset, which is loaded via `d3.json`. The chart renders within an 860×500 SVG, with both the pie and legend positioned explicitly via SVG transforms.

Vvidhyanamini

89% match

Loading thumbnail…

Fork of Fork of ICE7 Pie Chart

This chart displays the ten best-selling beauty products by revenue as a simple pie chart, with each slice sized proportionally to sales value and colored by category. A legend to the right pairs each product name with its revenue, formatted using D3’s `format` function. Built with D3 v5, it loads data from a JSON file and renders slices via `arc` and `pie` generators within an SVG canvas, using `scaleOrdinal` with the `schemeCategory10` palette for coloring.

RRevanthGrreddy

88% match

Loading thumbnail…

ICE7-PieChart-Part2

This example visualizes product revenue shares as a pie chart, with five cosmetic product categories (e.g., Eyeshadows, Mascara) and their corresponding percentages. A legend with colored dots and labels identifies each category, while the chart’s slices are labeled directly with product names. The visualization uses D3 v4’s `d3.pie` and `d3.arc` to generate the chart, `d3.scaleOrdinal` with `d3.schemeCategory10` for colors, and SVG rendering within a React framework. The data is hardcoded in the script, with all values summing to 100 percent.

Sskambhore04

86% match

Loading thumbnail…

Fork of Fork of ICE7 Pie Chart

A donut chart displays the revenue for ten beauty products, with arc size proportional to sales value and a legend mapping each product to its revenue. The visualization uses D3 v5, loading data from a JSON file and rendering with SVG. It defines pie segments using `d3.pie` and `d3.arc`, applies a categorical color scale from `d3.scaleOrdinal`, and constructs the legend with appended SVG groups, rectangles, and text elements. The chart title and legend labels specify the top-selling items, such as eyeshadows and eyeliner.

Ssowmyanagula@my.unt.edu

85% match

Loading thumbnail…

ICE 7 Pie Chart

This example visualizes top product sales as an interactive pie chart, with a legend displaying each product name and its corresponding unit count. The chart renders using D3 v5 within a React framework, leveraging `d3.pie`, `d3.arc`, and `d3.scaleOrdinal` with `schemeCategory10` for color encoding. Data is loaded from an external CSV file via `d3.csv`, sorted by sales value, and the top 10 items are selected for display. The SVG-based visualization includes hover logging of sales values, with legends positioned alongside the chart.

Llibramanju

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

83% match

Loading thumbnail…

CE7 Pie Chart

A pie chart displays revenue distribution across ten beauty products, with Eyeshadows and Eyeliner as the top sellers. The visualization uses d3.pie and d3.arc to compute and render SVG path segments, while d3.scaleOrdinal assigns category colors. A legend lists each product with its revenue value, formatted via d3.format. Data loads asynchronously from a JSON file using d3.json, with revenue values converted to numbers before rendering.

Ssowmyanagula@my.unt.edu

83% match