ICE7 by Sujit, Pie Chart

100%

ICE7 by Sujit, Pie Chart

✓ Published1🌍 Public

Last edited Apr 11, 2024

Created on Mar 27, 2024

This pie chart displays the Premier League’s top goal scorers, using color-coded slices to represent each player’s goal tally. The visualization first shows the overall distribution of goals before explaining the rendering: D3’s `pie` and `arc` generators create the chart, while `scaleOrdinal` maps player names to a pastel color palette. A legend on the right identifies each player, with data loaded from a CSV file. The code explicitly uses D3 v5 APIs like `d3.csv`, `d3.pie`, and `d3.arc` to build the SVG-based graphic, positioning labels via a secondary `labelArc` for clarity.

AI-generated description

ICE 7 Question 2 by Sujit Rayudu.

MIT Licensed

Similar vizzes

Loading thumbnail…

ICE-7 Pie Chart

This pie chart visualizes the top 10 run-scorers in a cricket dataset, highlighting each player’s share of total runs with a color-coded legend. The chart is built using D3 v5, with `d3.pie` and `d3.arc` generating the SVG segments, while `d3.scaleOrdinal` assigns colors. Data is loaded asynchronously from a CSV file via `d3.csv`. The legend displays player names and run totals formatted as thousands (e.g., “1.2K”), with values calculated from the raw data.

LLG0498

83% match

Loading thumbnail…

ICE7 by Sujit, Scatter Plot

This animated scatter plot visualizes Premier League player statistics, cycling through goals, assists, yellow cards, red cards, and minutes played every two seconds. Built with D3.js, it maps selected metrics to x- and y-axes using scaleLinear and extent, rendering data points as SVG circles. The visualization uses the scatterPlot reusable function, which applies axisLeft and axisBottom for labeled axes. Data is loaded from a remote CSV file containing football statistics. The animation alternates the x-axis metric while keeping assists on the y-axis, with smooth transitions updating the circle positions and axis scales accordingly.

Ssujitrayudu01@gmail.com

83% match

Loading thumbnail…

ICE - 7 Pie Chart krishna

This pie chart displays the top football players and their goal counts. Built with D3 v5 and rendered as an SVG, it visualizes data fetched from a GitHub Gist CSV file. The chart uses d3.pie to compute arc segments, d3.arc to generate the paths, and d3.scaleOrdinal for colors. Each slice is labeled with a formatted goal value, and a legend lists player names and corresponding goal totals. The chart is drawn on a 960x500 pixel SVG canvas centered on the page.

Mmandalasaikrishna007

83% match

Loading thumbnail…

Fork of ICE - 7 Pie Chart krishna

This pie chart visualizes the number of goals scored by top football players, with each slice representing a player’s goal count. The chart uses a simple flat design, with each slice labeled in thousands (e.g., "1.2K") and a legend listing player names alongside their corresponding goal values. The code leverages D3 v5 APIs including `d3.pie`, `d3.arc`, and `d3.scaleOrdinal` to compute slice geometry and map colors, while data is loaded from a CSV file using `d3.csv`. The chart is rendered as an SVG, with text and legend elements positioned manually for clarity.

Nnagasai.mandalapu@gmail.com

82% match

Loading thumbnail…

ICE - 7 Pie

A pie chart displays the career runs of the top 10 cricketers, with each slice labeled in thousands (e.g., "10K") and accompanied by a color-coded legend listing player names and values. The visualization loads CSV data from a GitHub gist, parses it with `d3.csv`, and renders slices using `d3.pie` and `d3.arc` with an SVG output. Colors are assigned via `d3.scaleOrdinal` from a predefined array, and text labels are positioned using the arc centroid method.

VVenkata Sai Preetham

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

81% match

Loading thumbnail…

ICE - 7 Pie

This visualization displays the top 10 cricketers' career runs as a pie chart, with each slice labeled with the run total in thousands and accompanied by a legend listing player names and values. The chart uses D3 v5’s `pie`, `arc`, and `scaleOrdinal` functions to generate SVG paths and text, with data fetched from a CSV via `d3.csv`. Colors are assigned manually, and the chart is rendered in a React-free HTML page using D3’s selection and enter/append pattern.

TTharun2022

81% match

Loading thumbnail…

ICE7 by Sujit, Line Chart

A line chart titled “Premier League Goals and Assists” visualizes the relationship between goals and assists for football players, with the data loaded from an external CSV file via `d3.csv`. The chart sorts players by goals and plots assists against goals using a linear scale for both axes. The visualization is rendered with D3 v6, using `d3.scaleLinear` for the axes and `d3.line` to draw a single steelblue path, while axis labels and ticks are added via `d3.axisBottom` and `d3.axisLeft`. The SVG output is centered on the page with a fixed width and height.

Ssujitrayudu01@gmail.com

81% match