ICE7

100%

✓ Published0🌍 Public

Last edited Mar 28, 2024

Created on Mar 28, 2024

This visualization presents a pie chart of video game sales by title, breaking down revenue across North America, Europe, and Japan. The chart uses an ordinal color scale and displays each game’s total sales and percentage in a legend. Built with D3 v5 and React, it loads CSV data and renders SVG paths using `d3.pie` and `d3.arc`, with legends and text labels positioned manually.

AI-generated description

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

Similar vizzes

Loading thumbnail…

ice 7 Pie Chart

This example presents a pie chart of global video game sales, visualizing the market share of ten games as percentages of total sales. The chart uses SVG rendering with D3.js v5, fetching data from a CSV file via the `csv` function. It leverages `d3.pie` and `d3.arc` to generate segments, `scaleOrdinal` for color mapping, and custom text labels for percentages. A legend, added manually, lists game names alongside their sales figures in millions, with all values formatted using `d3.format`.

TTejamod

88% match

Loading thumbnail…

ice 7 pie

This pie chart visualizes the top 10 best-selling video games globally, with sales figures in millions. Each slice is sized proportionally to the game’s total sales, and the chart uses an SVG rendering with D3 v4’s `d3.arc` and `d3.pie` APIs to generate the paths. Hovering over a slice highlights it while dimming the others, and a tooltip appears showing the game name and its exact sales value. The color scheme is applied via `d3.scaleOrdinal` with the `d3.schemeCategory20` palette. The data is hardcoded in the script as an array of name-value pairs.

TTejamod

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

85% match

Loading thumbnail…

Pie Chart ICE-7

This example visualizes the top 10 best-selling video game genres by global sales using a pie chart. Each slice represents a genre, with a legend listing genre names and total sales in dollars. The chart is rendered as SVG within a React application, using D3 v5 APIs including `pie()`, `arc()`, and `scaleOrdinal` for color mapping. Data is loaded via `csv()` from a GitHub gist, sorted by global sales, and the top 10 entries are displayed.

MManohar Kowthavarapu

85% match

Loading thumbnail…

Fork of ICE 7 Pie Chart

This pie chart visualizes global sales data for the top ten PlayStation 4 games, sorted by total units sold. It uses D3.js (v5) within a React framework to render an SVG with a pie chart and a corresponding legend, showing each game's genre and total units. The code employs `d3.pie` and `d3.arc` to generate the segments, and `d3.scaleOrdinal` with `schemeCategory10` for coloring, with data loaded via `d3.csv` from a GitHub repository.

Mmaheganesh

85% match

Loading thumbnail…

Anv_ICE-7 Pie Chart

This pie chart visualizes the proportion of total game sales for nine games, with each slice labeled by its percentage and a corresponding legend listing game names alongside their sales percentages. The chart is rendered as an SVG using D3.js v5, which computes the arc paths via the `pie` and `arc` functions. Data is fetched as CSV from a GitHub gist, and colors are assigned using a categorical scale based on `schemeCategory10`, with text and legends styled through CSS.

AAnvesh Chinta

84% match

Loading thumbnail…

ICE 7.2

A pie chart visualizes total sales data for U.S. states, with each slice labeled by its sales value in millions. A legend maps state names to their corresponding colors. The visualization uses D3.js v5 and React, fetching data from a CSV URL. The chart is rendered as an SVG, using D3's pie, arc, and scaleOrdinal APIs to generate the slices and color mapping.

Kkartik900

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