Skip to main content
SimilarExport ZIP
100%

Fork of Activity 7

✓ Published0🌍 Public
VVarshith Peddineni
Last edited Nov 6, 2024
Created on Nov 6, 2024
Forked from Activity 7

This example visualizes badminton player tournament wins as a pie chart, with each slice sized by the number of wins for 20 players from a CSV dataset. A legend lists player names with matching color swatches to identify each slice. The chart is built using D3 v6 APIs including `pie()`, `arc()`, `scaleOrdinal` with `schemeCategory10`, and `csv()` for data loading, rendered as SVG elements. Player names and win counts are parsed from a remote CSV file, and the visualization fills the browser window.

AI-generated description

An example showing the capabilities of VizHub:

  • Loads D3 via UNPKG.
  • Demonstrates use of import from "d3".
  • Demonstrates use of import from local ES6 modules.
MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Activity 7

This example visualizes delivery data as a pie chart, showing categorical proportions with labeled slices and a matching legend. Built with D3.js, it uses the pie and arc generators to compute slice geometry, scaleOrdinal with schemeCategory10 for colors, and SVG for rendering. The chart fetches its dataset from a GitHub-hosted CSV file and is implemented as a reusable piePlot component configured via chained methods for width, height, data, and field names.

Ggolisanthoshi2000@gmail.com
82% match
Loading thumbnail…

Fork of activity7jaswanth

This example shows a D3 pie chart that visualizes a CSV dataset, coloring each slice by genre category and displaying a legend. It loads data from a GitHub raw CSV file, converts string values to numbers, and uses `d3.pie` with `d3.arc` to generate SVG path slices. The chart applies a `d3.scaleOrdinal` with `d3.schemeCategory10` for colors, and adds a legend with `rect` and `text` elements, all rendered in an SVG container via D3 v6.

JJaswanthkota@my.unt.edu
81% match
Loading thumbnail…

Fork of ICE - 7 Pie

This pie chart visualizes the number of wins (labeled as goals) for top tennis players, using a CSV dataset fetched from a GitHub gist. The chart encodes each player’s total as a colored slice, with labels showing the value in thousands and a legend listing player names and their corresponding totals. Built with D3 v5 and rendered as SVG, the code uses `d3.pie` to compute arc angles, `d3.arc` for path generation, `d3.scaleOrdinal` for color assignment, and D3's `csv` for data loading.

RRahulChaitu999
81% match
Loading thumbnail…

Activity-7 Q1

This pie chart visualizes tennis players’ overall ratings, with each slice representing a player and labeled with their name and rating. The chart includes a color-coded legend and an interactive tooltip that displays each player’s average score on hover. The visualization loads CSV data from a GitHub gist and uses D3 v5 APIs including `d3.pie`, `d3.arc`, `d3.scaleOrdinal`, and `d3.format` to generate and style the SVG elements with mouse event handlers.

Bbhavanadupati3@gmail.com
81% match
Loading thumbnail…

Activity 7.1

This pie chart displays the total overall ratings of tennis players, with each slice representing an individual player and its size proportional to their rating. A legend and labels identify each player, while hovering reveals a tooltip with the player's country, average score, and total rating. Built with D3 v5, the visualization uses the `pie` and `arc` functions to generate the chart, `scaleOrdinal` for coloring, and custom mouseover events for interactivity. The data is loaded from a CSV file hosted as a GitHub gist.

Ssudhimaganti.49@gmail.com
81% match
Loading thumbnail…

Fork of D3 Starter

This pie chart visualizes the distribution of runs scored by individual cricket players, with each slice labeled by player name and colored via an ordinal scale. The chart is rendered as an SVG using D3.js v7, fetching CSV data from a GitHub Gist and parsing it with `d3.csvParse`. A `d3.pie` layout computes slice angles, while `d3.arc` generates the path geometry, and an interactive tooltip appears on hover for additional detail.

Ssdarsi2404@gmail.com
81% match
Loading thumbnail…

Activity7.1

A pie chart displays the share of browser usage from a CSV dataset, with each slice labeled by its percentage. The chart uses D3 v7 to load CSV data asynchronously, applies `d3.pie`, `d3.arc`, and `d3.scaleOrdinal` with the Tableau10 color scheme, and renders via SVG. A legend on the right maps color swatches to browser names, while slice texts show the corresponding usage values. The example demonstrates handling remote CSV data, SVG path generation, and legend construction with D3's `select` and `append` methods.

SSiddhardha
80% match
Loading thumbnail…

Question-Activity-7

This example visualizes the distribution of athletes across different sports using a pie chart. It loads a CSV dataset from a GitHub gist, groups the data by the sport column, and shows counts as pie slices with color-coded labels and a legend. The code uses D3’s `csv`, `pie`, `arc`, and `scaleOrdinal` APIs to generate the chart with a labeled x- and y-axis.

Kkotasc18@gmail.com
79% match