Skip to main content
SimilarExport ZIP
100%

PieChart

✓ Published0🌍 Public
KKondreddy Saikiran reddy
Last edited Apr 24, 2024
Created on Apr 24, 2024
Forked from LineChart

This visualization uses D3.js to display an interactive pie chart of wheat production by Indian states from 1966 to 2017. The chart aggregates production data from a CSV file, using `d3.pie()` to generate slices with an inner radius of zero, and `d3.scaleOrdinal` with `d3.schemeCategory10` for colors. Year checkboxes filter the underlying data via `d3.rollup`, recalculating totals and redrawing the chart, while `mouseover` events show tooltips with production values. The SVG rendering includes a legend and interactive state highlighting.

AI-generated description

An example showing the capabilities of VizHub:

  • Loads D3 via UNPKG.
  • Demonstrates use of import from "d3".
  • Demonstrates use of import from local ES6 modules.
MIT Licensed

Similar vizzes

Loading thumbnail…

pie chart

This pie chart visualizes rice production across Indian states, highlighting the highest and lowest producing regions in a summary below the chart. Built with D3 v7, it loads CSV data, aggregates production values per state using d3.rollup, and renders slices with d3.pie and d3.arc. The chart includes interactive tooltips that appear on mouseover, showing the exact production value for each state. An ordinal color scale assigns distinct colors to each slice within the SVG rendering.

Ssuchigeneralpur@gmail.com
86% match
Loading thumbnail…

PieChart

This SVG area chart displays total annual rainfall in India from 1960 to 2017, aggregated by year across all states. It uses D3 v7 to load CSV data via `d3.csv`, group and sum rainfall values with `d3.group` and `d3.sum`, and render the area path with `d3.area`. A hover tooltip, built with a D3 overlay rectangle and `d3.bisector`, shows the exact year and rainfall total. The chart includes labeled axes and a title, with styling from CSS.

KKondreddy Saikiran reddy
82% match
Loading thumbnail…

Task-9_Question-1

This donut chart visualizes total wheat production across Indian states, with data sourced from a CSV file. Users interact with checkboxes to filter the dataset by year, dynamically updating the chart. The visualization uses D3.js v7 APIs like `d3.pie()`, `d3.arc()`, and `d3.rollup()` to aggregate and render slices. Hovering over a slice highlights it and shows a tooltip with the state name and production value. The chart is rendered as an SVG with a color legend, and the code also logs total production to the console.

Mmasters200128@gmail.com
81% match
Loading thumbnail…

LineChart

A bubble chart displays wheat production data for Indian states, sourced from a CSV file. Each state is represented by a circle positioned in a grid, with the circle's radius scaled to the production value in thousands of tons. The visualization uses D3.js v7, with circles rendered as SVG elements. Hovering over a circle triggers a tooltip that shows the state name and its production figure. The chart includes axes, labels, and a title, all styled through CSS.

KKondreddy Saikiran reddy
80% match
Loading thumbnail…

Project_Line_Chart

This visualization tracks wheat production over time for various Indian states, using a multi-line chart where each colored line represents a state's annual output in tons. The chart displays a y-axis labeled "Production (tons)" and an x-axis labeled "Year," with key data points labeled directly at the end of each line. Built with D3.js, the code merges two CSV datasets from the author's GitHub repository—crop production and district-level data—filtering for wheat and mapping year and production values. The visualization uses `scaleTime` for the time axis, `scaleLinear` for the production axis, and the `line` generator to draw each state's trend line with `schemeCategory10` for color encoding.

Aanushapodapati99@gmail.com
79% match
Loading thumbnail…

Piechart ICE7

This pie chart displays the ten most populous Indian states in 2024, ranking them by population with a color-coded legend that labels each slice with the state name and its total population. The chart uses D3.js v7’s `d3.pie` layout and `d3.arc` generator to compute and draw the SVG paths, while a `d3.scaleOrdinal` with the `schemeTableau10` palette assigns colors. Data loads from a remote CSV file, and the legend is built with D3 selections, appending styled HTML divs.

MMahesh
78% match
Loading thumbnail…

Pie Chart

This pie chart displays total sales aggregated by state, sourced from a CSV file loaded via `d3.csv`. It uses `d3.rollup` and `d3.sum` to group the data, then renders slices with `d3.pie` and `d3.arc` in an SVG. Each slice is colored with `d3.scaleOrdinal` using `d3.schemeTableau10`, labeled with state names, and accompanied by a legend showing totals. The visualization is built entirely with D3 v7.

Sson.sultan@yahoo.com
78% match
Loading thumbnail…

Pie chart Visualization

This pie chart visualizes the top 10 Indian states by population, with each slice colored distinctly and paired with a legend listing state names and population values in thousands. Built with D3 v5, the code loads CSV data from a GitHub gist via `d3.csv`, computes arc segments using `d3.pie` and `d3.arc`, and renders the chart as SVG. Color mapping uses `d3.scaleOrdinal`, while numeric labels are formatted with `d3.format`. The legend is manually appended alongside the pie, and no interactivity is implemented.

DDanthalakirankumar
78% match