Skip to main content
SimilarExport ZIP
100%

Fork of Task 9 Pie Chart

✓ Published0🌍 Public
Ssaivaishnogaruda@gmail.com
Last edited Nov 1, 2024
Created on Nov 1, 2024
Forked from Task 9 Pie Chart

This pie chart example displays the distribution of car classes from a CSV dataset. It loads D3 via UNPKG and imports modules from local ES6 files, using `d3.pie`, `d3.arc`, and `d3.scaleOrdinal` to generate slices, labels with counts, and a legend. The SVG render includes labeled segments with white strokes and opacity styling, plus an optional title.

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 task 9 and 10 Q1 1

A pie chart displays the distribution of job titles from a CSV dataset, showing each title’s count as a labeled slice. D3 v7 loads the data with `d3.csv`, aggregates counts using `d3.rollup`, and renders pie arcs via `d3.pie` and `d3.arc`. Each slice is colored with `d3.scaleOrdinal` and `d3.schemeCategory10`, with labels placed at arc centroids. An HTML legend lists each title with a matching color swatch. The SVG output is sized at 600 by 600 pixels.

Ssruthimreddy6@gmail.com
86% match
Loading thumbnail…

Task 9&10

A pie chart displays the proportional quantities of five car models from a CSV file, with slices labeled by name. The static SVG visualization is built using D3 v7, loading data via `d3.csv` and computing arc paths with `d3.arc`. A categorical color scale from `d3.scaleOrdinal` colors each slice, while a custom legend lists the model names alongside colored swatches. The chart is rendered inside an SVG canvas with fixed dimensions, and slice labels are positioned using arc centroids.

Mmangilipallylaxminarayana@gmail.com
86% match
Loading thumbnail…

Task 9 and 10 - PieChart

This pie chart visualizes vehicle registration counts by type, sourced from a CSV file. The code uses d3.pie to compute the arc segments and d3.scaleOrdinal for coloring sections. d3.arc generates the chart's slices, with each segment labeled via arcGenerator.centroid. A legend, built with SVG rectangles and text, identifies each vehicle type alongside its count, with labels formatted using d3.format. The chart is rendered as an SVG.

PPothuguntla Pranitha
85% match
Loading thumbnail…

My Task 9

This example presents a pie chart visualizing car purchase percentages by brand, with a legend and axis labels. It loads a CSV dataset from a GitHub gist, and uses D3 v7 APIs including `d3.csv`, `d3.pie`, `d3.arc`, `d3.scaleOrdinal`, and `d3.schemeCategory10` to compute and render the arcs. The SVG chart is created in a container with a separate legend, and each slice includes a tooltip title showing the brand and percentage. The data is drawn directly from the remote CSV file, while the layout is fixed with explicit width and height margins.

Sshaikfiroze186@gmail.com
84% match
Loading thumbnail…

Fork of Activity7_Task1

This D3.js (v6) SVG pie chart visualizes species distribution from a CSV file fetched from a GitHub repository. The pie chart displays each species as a colored slice with a text label at its centroid, using a custom ordinal color scale. A legend is also rendered, mapping species names to their corresponding colors. The chart is constructed using `d3.csv`, `d3.scaleOrdinal`, `d3.pie`, and `d3.arc`, with slices and legend elements appended via `d3.select` and the `.join` operator for data-driven rendering.

Ssaimanvith22@gmail.com
83% match
Loading thumbnail…

Fork of task9

This fork shows a pie chart of categorical quality values, with each slice colored and paired with a legend and axis labels for quality and frequency. It uses D3 v7’s `d3.rollup` to count data points per quality category from an inline array, then `d3.pie` and `d3.arc` to generate SVG paths. A `d3.scaleOrdinal` maps categories to two colors, and hand-built SVG rect and text elements form the legend.

Vvandanakosuri@my.unt.edu
83% match
Loading thumbnail…

Task9_Q1

This example displays a D3.js pie chart visualizing horsepower totals for different car makes, with a legend showing each make and its percentage of the total. The chart uses a tooltip that appears on mouseover, revealing the make and horsepower value. The code imports D3 functions like `arc`, `pie`, and `scaleOrdinal`, and loads data from a GitHub CSV. It renders as an SVG with a categorical color scheme.

Pparvathi829790@gmail.com
83% match
Loading thumbnail…

Fork of Task 7

This pie chart shows the distribution of penguin species from a CSV dataset, displaying each species with its corresponding count labeled directly on the slices. The visualization uses D3 v6’s `pie()` and `arc()` generators to compute slice angles and paths, with `scaleOrdinal()` assigning categorical colors. Data is loaded asynchronously via `csv()` from a GitHub URL, and `d3.rollups()` counts occurrences per species before the SVG group is translated to center the chart. Slice labels combine species name and count, positioned using `arcGenerator.centroid()`.

Ssaimanvith22@gmail.com
83% match