kirankumari26guj@gmail.com

@kirankumari26·4 public vizzes

Fork of piechart

This fork of a pie chart visualizes Tokyo 2020 gold medal counts by country, displaying each nation’s share as a percentage label inside its slice. The chart loads CSV data via `d3.csv`, computes percentages, and renders SVG paths using `d3.pie()` and `d3.arc()`, with `d3.scaleOrdinal(d3.schemeCategory10)` for colors. A legend lists countries with their percentage values, while text elements with `tspan` lines show country names and percentages on each slice.

Mar 25, 2025

Loading thumbnail…

Fork of piechart

This fork of a pie chart example renders a static, basic pie chart using the D3.js library. The visualization displays proportional data as colored slices within a circle, though the specific dataset is not defined in the provided code. It employs D3’s arc generation and path-building functions to draw the pie segments, with the chart’s styling and layout determined by the underlying JavaScript logic. The example serves as a minimal template for creating pie charts, showing only a single static visualization without interactivity or animation.

Mar 25, 2025

Loading thumbnail…

Piechart

A pie chart displays chocolate sales proportions by product category. The visualization uses D3.js version 7, loading data from a CSV file and mapping category values to colors with `d3.scaleOrdinal` and `d3.schemeSet2`. The `d3.pie()` and `d3.arc()` functions generate the chart geometry, rendering each segment as a filled SVG path with white strokes. A custom HTML legend, built with D3 selections, labels each category using the same color scale, while the page layout is styled through external CSS.

Mar 24, 2025

Loading thumbnail…

Fork of Hello VizHub

This fork of Hello VizHub displays a chocolate sales pie chart, showing the distribution of chocolate brand sales through color-coded slices with a legend. The visualization loads CSV data from a GitHub gist, processes it with D3.js v7’s `d3.rollup` and `d3.pie`, and renders slices using `d3.arc`. A color scale with `d3.scaleOrdinal` assigns distinct colors to each brand. The code also includes a separate reusable `pieChart.js` module using `d3-shape` and `d3-scale-chromatic` for chart generation, with an SVG-based output.

Mar 24, 2025