Skip to main content
SimilarExport ZIP
100%

ICE-7 Hasini Pie Chart

✓ Published2🌍 Public
Hhasinipriyad7@gmail.com
Last edited Oct 25, 2025
Created on Oct 25, 2025

This pie chart visualizes the distribution of Quidditch house points from a CSV dataset, aggregated by house and displayed with labeled slices and an HTML legend. It uses D3 v6’s `d3.pie` and `d3.arc` generators to compute angles and paths, while a `d3.scaleOrdinal` assigns house colors. The SVG renders slices and text labels, and a separate legend div shows total points and percentages.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

ICE-7 Hasini Line Chart

This line chart shows the cumulative Quidditch points for four Hogwarts houses across match numbers, with each house represented by a distinct colored line and a legend. The visualization uses D3.js 6.7.0 with a linear x-scale for match numbers and a linear y-scale for points, rendering SVG paths via `d3.line` and axis generators. Data is loaded as CSV text from a GitHub gist and processed in `index.js` to compute per-house cumulative totals, while `lineChart.js` handles the chart structure and styling.

Hhasinipriyad7@gmail.com
86% match
Loading thumbnail…

ICE-7 Hasini Reusable Scatter Plot

This example shows a reusable scatter plot that compares Quidditch player performance, plotting total points against average points per match. Data is loaded from a gist and aggregated by player before rendering with D3 v6. The visualization uses d3.scaleOrdinal for house colors and symbols, d3.symbolGenerator for point shapes, and d3.axisBottom/Left for axes. Hovering highlights individual points and logs player details to the console, while a legend identifies the four houses.

Hhasinipriyad7@gmail.com
84% match
Loading thumbnail…

ICE-7 Hasini Area Chart

A stacked area chart visualizes the cumulative Quidditch points earned by each Hogwarts house across a series of matches. Using a step-after curve, the chart shows the contribution of Gryffindor, Slytherin, Ravenclaw, and Hufflepuff as layered areas, with an interactive legend identifying each house. The code uses d3.stack, d3.area, and d3.scaleOrdinal to generate the SVG rendering, with data aggregated from match records sorted by match number.

Hhasinipriyad7@gmail.com
83% match
Loading thumbnail…

pie chart ICE 7

This pie chart visualizes the distribution of total points accumulated by IPL teams from 2015 to 2024, using a CSV dataset loaded via `d3.csv`. Each slice represents a team’s aggregate points, with percentage labels positioned using `d3.arc` centroids and a color-coded legend rendered inside the SVG. The chart uses `d3.pie` and `d3.arc` to generate the slices, while `d3.scaleOrdinal` with `d3.schemeTableau10` assigns colors, all built with D3 v7 and SVG.

Aadithiarikatla@gmail.com
81% match
Loading thumbnail…

ICE-6

This horizontal bar chart displays total Quidditch points earned by players from a CSV file, with bars colored by Hogwarts house (Gryffindor, Hufflepuff, Ravenclaw, Slytherin) and labeled with each player's point total. The visualization loads data via `d3.csv`, aggregates points per player using JavaScript's `reduce`, and renders SVG elements through React components. Axis ticks, grid lines, and bar labels are generated using `d3.scaleBand`, `d3.scaleLinear`, and `d3.format`, while the chart layout is defined by explicit margin and size constants.

Hhasinipriyad7@gmail.com
81% match
Loading thumbnail…

ICE-6 Hasini

This example visualizes total Quidditch points per player as a horizontal bar chart, with bars sorted from highest to lowest and value labels placed beside each bar. Built with React and D3 v7, it uses a custom CSV parser to load and aggregate player-points data, then renders SVG marks via `d3.scaleBand` for the y-axis, `d3.scaleLinear` for the x-axis, and `d3.max` for domain calculation, with grid lines and formatted tick labels from `d3.format`.

Hhasinipriyad7@gmail.com
81% match
Loading thumbnail…

ICE-7 : Pie Chart

This pie chart displays the scores of 10 selected games from a CSV dataset, with each slice colored by game name and accompanied by a legend showing the game and its numeric score. The visualization uses d3.pie and d3.arc to generate the circular segments, with d3.scaleOrdinal assigning colors from a predefined range. Data is loaded asynchronously via d3.csv from a Gist URL, and the SVG rendering includes custom styled text and legends on a black background.

Ggunasindhuja
80% match
Loading thumbnail…

Pie Chart ICE 7

A pie chart visualizes proportional data from a local CSV file, with categories like Housing, Food, and Transport displayed as colored slices with percentage labels. The chart uses d3.pie() to convert values into angles and d3.arc() for generating slice shapes and positioning external labels. A legend in the top-left corner identifies each category with a color swatch. The SVG rendering uses d3.scaleOrdinal with schemeCategory10 for colors, and text styling applies the Share Tech font via CSS.

Ddiwashhumagain@my.unt.edu
80% match