Assignment 7 - Question 1

100%

Assignment 7 - Question 1

✓ Published1🌍 Public

Last edited Nov 7, 2025

Created on Nov 7, 2025

A pie chart visualizes the distribution of CSS named colors grouped by their first letter, showing the top 12 alphabetical categories with counts and percentages. The d3.v7 library loads CSV data from a GitHub gist, aggregates entries by initial character, and renders an SVG pie chart with ordinal color encoding, hover-to-scale effects, and interactive tooltips. Mouseover events trigger animated scaling and display details on category count and proportion, while a legend and title provide context.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Assignment 2 Question 1

This example shows the distribution of fruit categories using a pie chart, with each slice sized according to the value in the "4-5" column from a remote CSV file. The visualization renders as an SVG using D3 v7, with colored slices, a bold title, and an interactive legend that displays category names. D3's `d3.pie`, `d3.arc`, and `d3.scaleOrdinal` APIs generate the chart and color scheme, while the legend uses `rect` and `text` elements to map colors to categories. The data is fetched via `d3.csv` from a GitHub gist, and labels for "Category" and "Percentage" are added as static text elements.

Nnikhilapogula@my.unt.edu

84% match

Loading thumbnail…

Assignment 2 Question1

This pie chart visualizes genre distribution from survey data, showing the proportion of responses in the "Less than 3" category. The code loads CSV data from a GitHub repository and uses d3.pie and d3.arc to generate SVG path segments, with d3.scaleOrdinal assigning colors to genres. Interactive hover tooltips appear via appended title elements, and the chart includes a legend and percentage labels positioned at arc centroids. The visualization renders as a static SVG with D3 v7, totaling 600×600 pixels.

Mmeghna.reddy700@gmail.com

84% match

Loading thumbnail…

Assignment-2_Question-1

This example presents a pie chart visualizing the distribution of genres from a CSV dataset, loaded via D3’s `csv` fetcher and mapped to numerical values from the “Less than 3” column. Using D3 v7, it constructs a 600x600 SVG with `pie()` and `arc()` to generate slices, colored by `scaleOrdinal` and labeled with values at each arc’s centroid. A legend and title are added, with a color range from orange to green. The reusable `createPieChart` function encapsulates the rendering logic.

RRISHIK KURIKELLY

83% match

Loading thumbnail…

Assignment 2 - Question 1

This example shows a pie chart of food categories with quantities displayed both inside the slices and in a legend, using a color scale with four distinct sections. The visualization loads CSV data from a GitHub repository via `d3.csv`, then renders SVG arcs using `d3.pie` and `d3.arc` with an inner radius of zero. The chart positions text labels at each arc's centroid and appends a separate legend with rectangles and value labels. The code relies on D3 v5 APIs including `scaleOrdinal` for colors and `format` for tick value formatting, with styles defined in an external stylesheet.

Mmaheshchowdaryponnaganti@my.unt.edu

83% match

Loading thumbnail…

Activity 7_question1

A pie chart displays categorical sales proportions, with each slice labeled and colored by category. Hovering over a slice reveals an HTML tooltip showing the percentage of total sales. The visualization is built with D3 version 7, using the `d3.pie()` layout and `d3.arc()` generator to create slice paths. It loads CSV data from a GitHub Gist via `d3.json()`, applies an ordinal color scale, and includes a custom legend. An SVG canvas renders all marks, while tooltip positioning tracks mouse coordinates.

Ddivya.matavalam828@gmail.com

82% match

Loading thumbnail…

Assignment2_Question1.1

A pie chart visualizes the distribution of car makes from a CSV dataset, displaying each manufacturer’s share as a colored slice with percentage labels offset outside the chart. Hovering over a slice triggers a tooltip showing the same percentage. Built with D3 v7, the code loads data via `d3.csv`, groups records with `d3.group`, and renders the chart using `d3.pie`, `d3.arc`, and a `d3.scaleOrdinal` color scale with `d3.schemeCategory10`.

HHarsha vardhan reddy Yarmareddy

82% match

Loading thumbnail…

Assignment2 Question1

A pie chart visualizes sales distribution across five product categories, with each slice labeled and sized proportionally to its sales value. The chart uses D3.js v7 with SVG rendering, employing `d3.pie` to compute arc angles and `d3.arc` to generate the paths. A color ordinal scale assigns distinct hues to categories, while an accompanying legend lists each category with its exact sales figure. The data is loaded from a local array, matching the sample dataset, and the visualization centers the pie within a 600x500 SVG canvas.

Ppslharika@gmail.com

82% match

Loading thumbnail…

Activity7_Question1_1

This example shows a pie chart of programming language usage share percentages, with each category colored via a categorical color scale and labeled with its language name and percentage value. The visualization loads data from a CSV file using `d3.csv`, processes it with `d3.pie` and `d3.arc`, and renders the chart and a legend to SVG. Labels are placed outward from the arc centroids using `arcGenerator.centroid`, and the chart uses `d3.schemeCategory10` for distinct colors. The legend lists each language with its corresponding color and usage share, while the pie slices are semi-transparent with white stroke edges.

Nnavyabade05@gmail.com

82% match