Skip to main content
SimilarExport ZIP
100%

Fork of Reusable Scatter plot Activity 8

✓ Published0🌍 Public
Jjtulasi05@gmail.com
Last edited Nov 6, 2024
Created on Nov 6, 2024

This example shows a pie chart of breast cancer diagnosis counts, comparing malignant and benign cases. It loads CSV data via `d3.csv`, aggregates counts with `d3.rollup`, and renders slices using `d3.pie` and `d3.arc` in an SVG. Hovering displays a tooltip with details, while labels and a legend identify each category. The code uses `d3.scaleOrdinal` with `schemeCategory10` for colors and positions text labels at arc centroids via `arc.centroid`.

AI-generated description

A demonstration of reusable Pie chart.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Reusable Scatter plot Activity 8

This fork of a reusable scatter plot activity presents a pie chart visualization, using D3.js version 6.7.0. It loads a CSV dataset from a GitHub gist, converts the score column to numeric values, and renders a pie chart where each slice is labeled with the data's name category. The chart is created with a reusable pie chart function that uses D3's pie, arc, and scaleOrdinal APIs to compute slice geometries and assign colors from the Category10 scheme. The visualization displays category labels directly on each slice, with a white stroke for separation.

CChiranjeeviUppala@my.unt.edu
85% match
Loading thumbnail…

Fork of Reusable Scatter plot Activity 8

This pie chart visualizes the distribution of smokers versus non-smokers in a tips dataset. It uses d3.pie and d3.arc to generate SVG path slices, with a d3.scaleOrdinal color scale distinguishing the two categories. The chart includes labeled slices showing counts, plus a legend built from SVG rect and text elements. Data is loaded asynchronously via d3.csv from a GitHub gist, and nested grouping with d3.nest calculates category frequencies.

Bboinapallyhimaja657@gmail.com
85% match
Loading thumbnail…

Fork of Reusable Scatter plot Activity 8

This example presents a reusable pie chart module built with D3.js. It shows species count data as a circular chart with colored slices, tooltips on each arc, and a legend with color swatches. The visualization uses the D3 `pie()` and `arc()` generators to compute and draw the arcs, and centers labels within each slice using `arcGenerator.centroid`. The chart’s dimensions and dataset are configurable through the module’s width, height, and data accessor methods.

SSupriya Ravilla
84% match
Loading thumbnail…

Fork of Reusable Scatter plot Activity 8

This fork demonstrates a reusable pie chart that visualizes the species counts from the Iris dataset, loaded via the `d3.csv` function. The chart renders as SVG using D3 v7 APIs, including `d3.arc` for arc path generation and `d3.pie` for computing arc angles from the count data. A categorical color scale maps each species to a distinct color, with an accompanying legend built through D3 selections. The visualization is encapsulated in a custom `pieChart` function, which accepts configurable width, height, margin, and color scale setters.

SSupriya Ravilla
83% match
Loading thumbnail…

Fork of Reusable Scatter plot Activity 8

This pie chart displays the proportion of smokers versus non-smokers in a dataset loaded from a GitHub gist. The visualization uses D3.js v6's `d3.pie` and `d3.arc` to generate SVG paths, with `d3.scaleOrdinal` assigning blue and red fills for the two categories. Each slice is labeled directly with its category name and count using the arc centroid. A separate HTML legend, built with D3 selections, repeats the color-keyed counts beside the chart, all rendered on a styled sky-blue background.

Bboinapallyhimaja657@gmail.com
83% match
Loading thumbnail…

Fork of Reusable Scatter plot Activity 8

This example visualizes the Iris dataset with two SVG charts: a pie chart showing species distribution and an area chart tracking petal length across sample IDs. The pie chart uses `d3.pie()` and `d3.arc()` with an ordinal color scale, while the area chart employs `d3.area()` with a monotone curve and linear scales for axes. Data is loaded asynchronously via `d3.text()` from a CSV file hosted on GitHub, then parsed and aggregated using `d3.rollups`. Both charts include custom legends, axis labels, and tooltips-style text annotations, rendered entirely with D3 v6.7.0.

Ssravya.mundluru@gmail.com
82% match
Loading thumbnail…

Reusable Scatter plot Activity 8

This chart displays the proportional distribution of car conditions using a pie chart. The visualization uses a categorical color scale for each condition and includes labels on the slices, a chart title, and a legend with counts. It is built with d3’s `select`, `arc`, `pie`, `scaleOrdinal`, and `schemeCategory10` APIs, rendering as an SVG. Data is loaded from a remote CSV file via `csv()`. The pie slices are drawn with `arcGen` and `pieGen`, with each slice labeled and colored accordingly.

Pperamranji
81% match
Loading thumbnail…

Fork of Reusable pie chart

This example is a reusable pie chart that visualizes categorical data from a CSV file containing wine characteristics. It shows how each category's proportion is represented as a slice of the pie, with labels positioned at each slice's centroid and a color scale applied via `d3.scaleOrdinal` with the `d3.schemeCategory10` palette. The chart is rendered as an SVG using D3 v7, with pie geometry computed through the `d3.pie` and `d3.arc` APIs. Hovering over a slice triggers a brief animation that expands the arc outward using D3 transitions, providing interactive feedback. The data is loaded asynchronously via `d3.csv`, and numeric values are converted before the slices are appended.

Vvaishnavgck@gmail.com
81% match