Skip to main content
SimilarExport ZIP
100%

ICE 7 - Pie Chart

✓ Published0🌍 Public
Kkotlavamsireddy@gmail.com
Last edited Mar 28, 2024
Created on Mar 28, 2024
Forked from HTML Starter

This pie chart shows the distribution of smokers versus non-smokers in an insurance dataset, highlighting the proportion of each category. It uses D3.js v7’s `d3.pie` and `d3.arc` to generate the SVG arcs, with a color scale assigning teal to smokers and orange to non-smokers. Interactive tooltips appear on mouseover, displaying the category name and count. The data is fetched from a remote CSV file, and a legend below the chart clarifies the color coding.

AI-generated description

See also Raw code data link.

MIT Licensed

Similar vizzes

Loading thumbnail…

ICE7_11703795_PieChart

This pie chart displays the distribution of smokers versus non-smokers from a health information dataset, revealed through two labeled slices. The visualization aggregates the dataset’s `smoker` column by counting occurrences of “yes” and “no” values. Using D3 v7, the code applies the `d3.pie()` layout and `d3.arc()` generator to render SVG paths, with `d3.schemeCategory10` coloring each slice. A legend, constructed manually with SVG rectangles and text, maps colors to categories. The chart loads remote CSV data via `d3.csv()` and includes a fixed 400x400 pixel SVG canvas.

MMeghanaChowdaryVelaga@my.unt.edu
91% match
Loading thumbnail…

ICE7_PieChart_HarshaPalacharla

This pie chart visualizes the distribution of smoking habits from a CSV health dataset. It shows the relative counts of each smoking habit category as colored slices, with labels and a legend displaying the exact counts. The visualization is built with D3 v7, using `d3.pie()` and `d3.arc()` to generate the slices, `d3.rollup()` to aggregate the data, and `d3.scaleOrdinal()` with `d3.schemeCategory10` for coloring. The SVG rendering positions labels via `labelArc.centroid()` and places the legend to the right of the chart.

Nnagasuryaharsha999@gmail.com
85% match
Loading thumbnail…

ICE 7

This pie chart visualizes sales by category, displaying five segments for electronics, furniture, clothing, and toys. The chart uses D3.js v7 to load the sales.csv dataset, then applies `d3.pie()` and `d3.arc()` to compute slice geometries, with `d3.scaleOrdinal` and `d3.schemeTableau10` assigning colors. It renders as SVG with category labels positioned via `labelArc.centroid()` and includes a legend showing each category and its value. Hovering over a slice reveals a tooltip with the category name and numeric value.

Aankitgoudpoodhari07@gmail.com
82% match
Loading thumbnail…

ICE-7

A pie chart visualizes sales by category from a CSV dataset, using d3.csv to load values. The SVG graphic displays category labels on each slice via d3.arc and a legend on the right. D3 v7’s pie generator computes the arc angles, while d3.scaleOrdinal with schemeTableau10 assigns colors. The code uses `d3.pie()` and `d3.arc()` to generate paths, with tooltips added as titles, and a legend built from rectangles and text elements.

Aankitgoudpoodhari07@gmail.com
82% match
Loading thumbnail…

ICE 7 - Pie Chart

This pie chart visualizes speaker demographics, displaying the distribution of counts by sex. Each slice is colored via `d3.scaleOrdinal` and drawn with `d3.arc`. The legend on the right, built with SVG `rect` and `text` elements, shows each category, its percentage of the total, and the raw count in thousands. Data is loaded from a CSV file using `d3.csv`, with values aggregated and formatted using `d3.format` for display.

JJustin Roberts
82% match
Loading thumbnail…

ICE - 7 Pie Chart

A pie chart displays the distribution of accident rates across different countries, with each slice labeled with its percentage value. The visualization uses a legend to list countries with their corresponding values and color-coded swatches. The chart is built with D3 v5, using the `pie`, `arc`, and `scaleOrdinal` functions to generate arcs and assign colors from a custom palette. Data is loaded asynchronously from a CSV URL, and the code applies `format('.4~g')` to display tick values.

SSharmilaChowdhari
81% match
Loading thumbnail…

ICE 7 PIE-CHART

This pie chart visualizes drug satisfaction survey results, with each slice representing a drug and its corresponding satisfaction percentage. The chart uses D3.js v5 to load CSV data from a Gist URL via `d3.csv`, render the pie using `d3.pie` and `d3.arc`, and color segments with `d3.scaleOrdinal`. A legend lists drug names and computed percentages, formatted with `d3.format` to five significant digits. The SVG output is interactive in layout but static in behavior, with all elements positioned explicitly.

DDeepa-Murugesan
81% match
Loading thumbnail…

Piechart ICE - 7

This interactive D3.js visualization displays a pie chart of insurance policy numbers against their corresponding insured values. The chart partitions a circle into colored slices, each representing a policy, with the slice size proportional to the insured value, and labels each slice with its value. A legend on the right maps the slice colors to policy names and values. The implementation uses D3’s `pie`, `arc`, and `scaleOrdinal` APIs, reading data from a remote CSV file. Rendering is done via SVG, with data processed through the `d3.csv` function, and includes custom styling for the legend text and labels.

Vvamshisoletii
81% match