Fork of Pie Chart

100%

Fork of Pie Chart

✓ Published0🌍 Public

Last edited Jun 30, 2022

Created on Jun 30, 2022

This visualization displays a pie chart comparing the pollution levels across 10 US states, with each slice labeled by its population value and accompanied by a color-coded legend. It uses D3.js (v5) to fetch CSV data from a GitHub gist, then renders the chart as SVG elements. The code employs D3's `pie` layout, `arc` for generating the pie segments, `scaleOrdinal` for assigning categorical colors, and `format` for tick label formatting. A legend group is constructed with rectangles and text elements to identify each state and its corresponding population.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Pie Chart

This pie chart displays the pollution levels of ten US states, with each slice labeled and colored to represent a state’s relative contribution. The visualization uses D3.js v5’s `d3.pie()` and `d3.arc()` generators to compute slice angles and paths, rendering the chart as SVG elements in a 900×450 pixel canvas. The code assigns slice colors based on an ordinal scale and includes a legend alongside the chart. The data is embedded directly in the script, and the title indicates the focus on state-level pollution metrics.

Hharika-1929

92% match

Loading thumbnail…

Fork of ICE7-Pie Chart

This fork of ICE7-Pie Chart shows the pollution levels and population for ten US states using a pie chart rendered as SVG. Each slice represents a state’s population, with slice labels and a legend listing state names and population values in millions. The visualization uses D3 v5’s `pie`, `arc`, and `scaleOrdinal` APIs to compute the arcs and assign a custom color palette. Data is fetched asynchronously from a CSV hosted on GitHub, and the chart is drawn by appending paths and text elements to the SVG canvas.

KKolliTeja

90% match

Loading thumbnail…

Fork of Fork of Pie_chart_Us_states_density

A pie chart displays the population density for the top 10 US states, with a legend listing each state and its density value in thousands. The visualization is built using D3 v5, with `d3.pie` and `d3.arc` generating the chart segments, and `d3.scaleOrdinal` providing the color palette. Data is loaded asynchronously from a CSV file hosted on a GitHub gist using `d3.csv`. The chart is rendered as an SVG element, with custom styling applied through a separate CSS file for the title, legend text, and labels.

SSushmareddy-gudipally

88% match

Loading thumbnail…

Fork of Fork of Fork of Pie_chart_Us_states_density

This visualization shows the top 10 US states by population density as a pie chart, with a legend listing each state and its population value in thousands. The chart is rendered as an SVG using D3 v5, with pie and arc generators computing the segment paths, and a scaleOrdinal mapping categorical colors to each state. Population data is loaded from a remote CSV via d3.csv, and the legend displays formatted values using d3.format.

SSushmareddy-gudipally

88% match

Loading thumbnail…

Fork of Pie_chart_Us_states_density

This pie chart shows the top 10 U.S. states by population density, with each slice colored and labeled by state, and its value displayed in thousands. The visualization loads CSV data from a GitHub gist via `d3.csv`, then uses `d3.pie` and `d3.arc` to generate SVG paths, with `d3.scaleOrdinal` assigning a fixed color palette. A legend, built with appended SVG rectangles and texts, maps each color to its state and density value, formatted using `d3.format`. The rendering is entirely SVG-based, with custom styling from an external stylesheet.

SSushmareddy-gudipally

87% match

Loading thumbnail…

Fork of Fork of Pie_chart_Us_states_density

This example renders a pie chart of the top 10 U.S. states by population density, using D3.js v5 with SVG elements. The visualization presents each state as a colored slice, with a legend listing state names and density values in thousands. The code loads CSV data from a GitHub gist via `d3.csv`, then applies the `d3.pie` layout and `d3.arc` to generate the chart, while `d3.scaleOrdinal` assigns a distinct color palette and `d3.format` styles the density labels.

VVenkata Rajashekar Reddy Chinthala

87% match

Loading thumbnail…

Fork of ICE7-Pie Chartsdfb

This example displays a donut-style pie chart of US state pollution data, drawn with SVG and D3 v5. The visualization uses `d3.pie` to compute arc segments and `d3.arc` for centroid labels, with a categorical color scale from `d3.scaleOrdinal`. Population values, fetched from a CSV, are shown inside each slice, while a legend lists states and their corresponding millions. The code also leverages D3’s `select` and `format` APIs for layout and number formatting.

Aakshitha.rapala@gmail.com

87% match

Loading thumbnail…

Pie Chart

This pie chart visualizes population figures for US states, displaying each state as a colored slice with its population value labeled in millions. The chart uses d3.pie() to compute angular segments and d3.arc() with an inner radius of zero to generate the SVG paths. A legend is rendered to the right, mapping each state name to its corresponding color and population value. The data is loaded as CSV from a GitHub gist, and colors are assigned using d3.scaleOrdinal() with a predefined array of ten distinct colors.

Hharika-1929

87% match