Skip to main content
SimilarExport ZIP
100%

Task-10

✓ Published0🌍 Public
Bbhargavr016@gmail.com
Last edited Apr 29, 2024
Created on Apr 29, 2024
Forked from Hello VizHub

This example displays a pie chart with a side legend, both rendered as SVGs. The D3 pie layout computes arc angles based on the percentage values, while d3.arc generates the path data and d3.schemeTableau10 assigns categorical colors. A second SVG contains the legend with colored rectangles and text labels, and the data is loaded from a remote CSV file.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Task 9&10-Q1

A pie chart visualizes three categories with values 30, 50, and 20, using a color-coded legend. Built with D3 v7, the example loads D3 via UNPKG and imports `pie`, `arc`, and `scaleOrdinal` from local ES6 modules. The SVG chart centers arcs with a translated group element, while a separate group renders the legend. Data is hardcoded in `index.js`, and the chart updates through D3’s data join pattern.

Sshraehithareddy@gmail.com
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…

task 9 and 10 Q1 11111

This pie chart visualizes the distribution of job titles in a dataset loaded from a CSV file, with each slice labeled by job title and count. The code uses d3.csv to fetch the data, d3.rollup to count occurrences per job title, and the d3.pie and d3.arc layouts to generate and render the arcs in SVG. A categorical color scale from d3.schemeCategory10 assigns colors to slices, and an HTML legend is dynamically appended to the page. The chart is centered within an SVG container sized at 450 by 450 pixels.

Ssruthimreddy6@gmail.com
84% match
Loading thumbnail…

task9&10

This pie chart displays the proportional distribution of fruit quantities from a CSV file, labeling each slice with its fruit name and including a color-coded legend. Built with D3 v7, it uses the `d3.pie` and `d3.arc` generators to compute and render arcs as SVG paths, with `d3.scaleOrdinal` assigning categorical colors. Data is loaded asynchronously via `d3.csv`, and labels are positioned using `arc.centroid`.

HHanuReddy
84% match
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
83% match
Loading thumbnail…

task 9 Q1

This example displays a pie chart with a legend, using a dataset fetched from a GitHub-hosted CSV. Each sector of the pie represents a percentage value, and the legend lists the sector names alongside their corresponding percentages. The visualization is built with D3 v6, employing the `d3.pie` and `d3.arc` APIs for the chart itself, while the legend is constructed as a separate SVG element. Data is loaded asynchronously via `d3.csv`, and colors are assigned using a Tableau10 color scheme.

Ppavanpkkalyan3@gmail.com
83% match
Loading thumbnail…

Task 9&10 Q1

This example shows a pie chart displaying total sales distribution across item categories, with each slice labeled by category name and sales amount, plus a legend on the right. The visualization is built using D3.js version 6, employing `d3.pie`, `d3.arc`, and `d3.scaleOrdinal` with `d3.schemeCategory10` for coloring. Data is loaded from a remote CSV file via `d3.csv`, and aggregated using `d3.rollups` to sum sales per category. The chart includes a title and subtitle, rendered as SVG text elements.

Mmdadeebfarhaan@gmail.com
83% 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
82% match