Skip to main content
SimilarExport ZIP
100%

Task-10_Q1

✓ Published1🌍 Public
UUthkarsh Reddy Junuthula
Last edited Apr 22, 2024
Created on Apr 22, 2024

This example displays a pie chart showing the distribution of bedroom counts in a housing dataset. The visualization aggregates the data using d3.rollup, then renders the chart with d3.pie and d3.arc, with slices colored by d3.scaleOrdinal and d3.schemeCategory10. Interactive tooltips appear on mouseover, and labels are positioned using path.centroid. A legend encodes the bedroom categories. The data is loaded via d3.csv from a GitHub gist, and the chart is rendered as an SVG with a tooltip div styled in CSS.

AI-generated description

A demonstration of reusable scatter plot.

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

Task9_Q1

This pie chart displays the sales distribution for ten product types, ranging from Plushies with 5000 units to Watches with only 30 units. The chart is rendered as an SVG using the D3.js v4 library, with each slice colored via a custom ordinal palette. The code defines a fixed dataset inline, uses `d3.pie()` to compute the arcs, and `d3.arc()` to draw them. A clickable legend is positioned to the right, although the click handler does not implement filtering logic.

Jjyothirmai318@gmail.com
78% match
Loading thumbnail…

Task - 9&10 - Q1)

This D3.js v7 visualization displays the prices of various gadgets as an interactive pie chart with a legend. It uses `d3.pie` and `d3.arc` to compute the chart geometry, with categorical colors from `d3.schemeCategory10` via `d3.scaleOrdinal`. Hovering over a slice reveals a tooltip showing the gadget name and price, and each slice is labeled with its corresponding name. Data is loaded from a remote CSV file using `d3.csv`. The chart is rendered as SVG, with the legend positioned separately using `d3.select` and appended HTML elements.

Mmulyasuji999@gmail.com
78% match
Loading thumbnail…

Task9

This pie chart displays the proportional breakdown of a small, simulated fruit dataset, with categories like Apples, Oranges, Pears, and Bananas. Built with D3 version 7, the visualization uses `d3.pie` to compute arc segments and `d3.arc` to render each slice, with a color scale via `d3.scaleOrdinal`. An SVG-based legend with rectangles and text complements the chart, while slice labels (category and value) are placed using arc centroids. The data is entirely made-up, as noted in the code comments.

Jjarethodges@gmail.com
78% match
Loading thumbnail…

Task9_Question1

A pie chart displays the distribution of ratings across different genres, with each slice labeled by its percentage and a color-coded legend listing the genre names. The visualization loads genre and rating data from a remote CSV file and renders it as an SVG using D3 v7. The code uses `d3.pie` to compute slice arcs, `d3.arc` to generate the path geometry, and `d3.scaleOrdinal` with `schemeCategory10` for slice colors. Percentage labels are placed at slice centroids via the arc generator's `centroid` method.

KKeerthi
77% match
Loading thumbnail…

activity9-1

This example shows the distribution of occupations from an online food ordering dataset as a pie chart. It counts the occurrences of each occupation and visualizes the proportions using colored slices with an accompanying legend. The chart is built with D3 v6, using the `pie`, `arc`, `scaleOrdinal`, and `schemeCategory10` APIs. Data is loaded from a remote CSV file, parsed, and then rendered as an SVG with a fixed width and height.

Ssahaspragna6@gmail.com
76% match
Loading thumbnail…

Task 9

This pie chart visualizes the number of families across five countries, with each slice sized proportionally to its value in the dataset. The chart is rendered as an SVG using D3.js (v7), leveraging the `d3.pie` layout and `d3.arc` generators to draw the slices and labels. Each slice is labeled with its country name, and a separate HTML legend, built with `d3.select`, displays color-coded entries. The color scheme uses `d3.schemeCategory10` for slice and legend colors, sourced from the community.csv data.

Ssaibharath7thota@gmail.com
76% 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
76% match