Skip to main content
SimilarExport ZIP
100%

My Task 9

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

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.

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…

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
87% 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
85% match
Loading thumbnail…

Task-9/10 Q1

This D3.js pie chart displays the distribution of automobile makes by their average horsepower values, with each car make represented as a colored slice paired with a custom legend. The visualization loads CSV data from a GitHub repository using `d3.csv`, then applies `d3.pie()` to compute arc angles and `d3.arc()` to generate the SVG path geometries. A categorical color scale (`d3.scaleOrdinal` with `schemeCategory10`) colors each segment. The code renders the chart inside an SVG container with explicit width and height attributes, while a separate HTML div builds the legend items using dynamically generated colored circles and text labels.

Ttallurisaiteja96@gmail.com
85% match
Loading thumbnail…

Fork of 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.

Ssaivaishnogaruda@gmail.com
84% 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
84% match
Loading thumbnail…

ice7_task2_1

This example shows the distribution of car brands in a dataset as a pie chart, with each slice labeled by brand name and its percentage of the total. The visualization loads data from a remote CSV file using `d3.csv` with `d3.autoType`, then aggregates counts per brand via `d3.rollups`. It computes slice geometry with `d3.pie` and renders the arcs using `d3.arc`, applying a categorical color scale with `d3.scaleOrdinal` and `d3.schemeTableau10`. A manual legend lists the brands, using SVG groups and rectangles.

Kkmohithkumar7@gmail.com
84% match
Loading thumbnail…

Task-10

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.

Bbhargavr016@gmail.com
84% 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