Vizhub for pie chart

100%

Vizhub for pie chart

✓ Published0🌍 Public

Last edited Jul 2, 2022

Created on Jul 2, 2022

This pie chart visualizes the top five U.S. states by fuel consumption percentage, with each slice labeled and color-coded, alongside a legend listing state names and values. The data is loaded from a CSV file via `d3.csv`, and the chart is rendered as SVG using `d3.pie`, `d3.arc`, and `d3.scaleOrdinal` for colors. Text labels are positioned on slice centroids with `arcGenerator.centroid`, while the legend is built manually with SVG rectangles and text elements. The visualization updates dynamically as the CSV is fetched asynchronously.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Pie Chart

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.

NNaimisha-M

81% match

Loading thumbnail…

Pie_chart_Us_states_density

A pie chart displays the population density of the top 10 U.S. states, with each slice sized proportionally to its density value and colored via a distinct scale. The chart labels each state with its density in thousands, and a legend lists states with corresponding color swatches. Built with d3.v5, the visualization loads CSV data from a GitHub gist using `d3.csv`, computes pie angles with `d3.pie`, draws SVG paths via `d3.arc`, and assigns colors through `d3.scaleOrdinal`. The SVG canvas is 960 by 500 pixels, with the pie centered and legends offset to the right.

MMeghanaArepalli

80% match

Loading thumbnail…

Pie Chart

This pie chart visualizes the population distribution across U.S. states, using a categorical color scale for each state. The D3.js code loads CSV data from a Gist, calculates each state's share via the `pie` layout, and renders SVG slices with `arc` paths. A legend translates each sector's value into abbreviated format (e.g., "K" for thousands), while the chart is generated with `scaleOrdinal` for colors and D3's `format` for tick labels.

Pprajoth0405

80% match

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

80% 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

80% match

Loading thumbnail…

Fork of Pie chart ICE7

This visualization shows the top five states by Democratic vote count from a cocoa-related dataset, displayed as a pie chart with state names positioned inside each slice. The chart uses D3 v6’s `pie` layout, `arc` generator, and `scaleOrdinal` with `schemeCategory10` for colors. Data is fetched via `d3.csv` from a GitHub Gist, sorted, and sliced to the top five entries. Each slice’s label uses an `arc` with a reduced inner radius to place text via `label.centroid`. The SVG is centered with CSS.

MMar-99

79% match

Loading thumbnail…

Pie Chart US State Density

A pie chart displays the top 10 US states by population density, with each slice colored and sized proportionally to its density value in thousands. The visualization includes a legend with state names and formatted density labels. Data is loaded asynchronously from a CSV file via `d3.csv`, then processed and rendered using `d3.pie`, `d3.arc`, and `d3.scaleOrdinal` for color mapping. The SVG is generated with d3 v5 and uses `d3.format` for tick label formatting, with all visual elements drawn as SVG paths and rectangles.

PPavaniMangugari

78% match

Loading thumbnail…

ICE-7_Pie Chart

This pie chart displays the distribution of carbon emissions across different states in the USA, with each slice representing a state’s total emissions in thousand tonnes. The visualization uses D3 v5’s `pie` and `arc` generators to create the SVG segments, while `scaleOrdinal` assigns colors to each state. Legends are positioned manually alongside the chart, and data is loaded asynchronously from a CSV file via a custom `getData` function using D3’s `csv` method.

Nnithish-1999

78% match