Fork of Pie Chart

100%

Fork of Pie Chart

✓ Published0🌍 Public

Last edited Apr 9, 2023

Created on Apr 9, 2023

This visualization shows the distribution of gender categories in a heart disease dataset using a pie chart. It displays two slices representing male and female counts, with a legend showing each category and its frequency. The chart is rendered as an SVG using D3 v7, with d3.rollup to aggregate counts, d3.arc for slice geometry, and d3.pie for layout. A d3.scaleOrdinal with d3.schemeCategory10 assigns colors, while Bootstrap provides page styling. Data is loaded from a CSV file via d3.csv.

AI-generated description

A bare minimum HTML page demonstrating use of CSS and JavaScript.

Similar vizzes

Loading thumbnail…

Pie Chart

This pie chart visualizes the distribution of gender categories from the Heart2020Cleaned dataset, with each slice proportionally representing the count of occurrences per category. The visualization uses D3 v7’s `d3.rollup`, `d3.pie`, and `d3.arc` to compute and render the slices, while a categorical color scale (`d3.scaleOrdinal` with `d3.schemeCategory10`) distinguishes each group. A legend with colored rectangles and text labels displays each category name alongside its count, rendered as SVG within a Bootstrap-styled HTML page.

Cchandanagandla

89% match

Loading thumbnail…

Fork of Pie Chart

This visualization compares BMI values against general health categories using a pie chart, with the top ten highest BMI records from a heart disease dataset. The chart renders as an SVG using D3's `pie` and `arc` generators, with each slice colored via `scaleOrdinal` and `schemeCategory10`. A legend lists health categories with corresponding values, and hovering over a slice logs its BMI to the console. Data is loaded as CSV via `d3.csv`, while the React-free interface relies on plain D3 selections and the `bundle.js` build.

Cchandanagandla

84% match

Loading thumbnail…

Fork of Pie Chart

A forked pie chart visualizes the distribution of new COVID-19 tests across geographic locations, using a D3 v5 pie layout with an SVG rendering. The chart shows the top 10 locations by test count, with each slice’s fill color and legend labels derived from the `d3.scaleOrdinal` and `d3.schemeCategory10` palette. Data is loaded from a CSV via `d3.csv`, sorted descending, and rendered with `d3.pie` and `d3.arc`; hover events log values to the console, and legends display each location’s name and test total. The React-based example is presented in an HTML page with custom CSS styling.

Ppemmasaniprudhvinadh

82% match

Loading thumbnail…

Fork of radial pie ex

This visualization presents a radial pie chart where two categorical groups, Female and Male, are compared across five age buckets. The code uses D3 v4 with the `d3.arc` generator to create annular sectors, with a custom `d3-scale-radial.js` module providing `scaleRadial` for radial extent mapping. Data is loaded from CSV files, and a stacked layout via `d3.stack` layers the age categories. SVG rendering includes grid circles, rotated gender labels, and a legend, all centered within a 960-pixel square canvas.

VVineela Reddy

82% match

Loading thumbnail…

Fork of Pie chart

A donut chart displays the distribution of survey respondents across different age groups, with each segment colored distinctly and labeled with its corresponding value. Legends on the right identify each age group and its member count. The visualization uses D3 v5’s `pie` and `arc` generators to compute segment paths, `scaleOrdinal` for color mapping, and `format` for number formatting. Data is fetched as CSV from a GitHub gist, and the SVG is rendered within a React component.

VVineela Reddy

80% match

Loading thumbnail…

Fork of Fork of Pie chart

This example displays an interactive pie chart showing the distribution of survey participants across different age groups, with each slice labeled with its value and accompanied by a legend listing age groups and member counts. The visualization fetches CSV data from a remote GitHub gist using `d3.csv`, then renders SVG paths with `d3.pie`, `d3.arc`, and `d3.scaleOrdinal` for color mapping. Text labels are positioned using `arc.centroid`, and the legend is built manually with SVG rectangles and text elements. The chart is styled with custom CSS, including hover-free static rendering and a centered title.

Aajaysonu

80% match

Loading thumbnail…

Fork of

A pie chart displays marks for different subjects, with each slice colored and paired with a legend identifying the subject and its numeric value. The chart reads subject and mark data from a CSV file via `d3.csv`, and uses `d3.pie` and `d3.arc` to compute the slice geometry, while `d3.scaleOrdinal` assigns categorical colors. Legends are generated as SVG groups with rectangles and text, and the whole visualization is rendered as an SVG element.

Ppravalika.thogaru10@gmail.com

80% match

Loading thumbnail…

Fork of Pie Chart

This interactive pie chart displays life expectancy across continents, ranking the top ten entries from a CSV dataset loaded via d3.csv. The visualization uses d3.pie and d3.arc to generate SVG path segments, with d3.scaleOrdinal and schemeCategory10 assigning colors. Legends are appended as separate SVG groups, showing continent names and values with formatted numbers. Mouseover events log data to the console, while the chart is rendered within a React application using d3 v5.

NNukaShravanKumar

80% match