Skip to main content
SimilarExport ZIP
100%

activity9-task9

✓ Published0🌍 Public
BBindumadhavi
Last edited Apr 28, 2024
Created on Apr 28, 2024
Forked from Task9_Q1

This pie chart visualizes net electricity consumption worldwide from 1982 to 2022, displaying the top 15 years by consumption value. The visualization uses D3 v5 within a React framework to render SVG arcs via `d3.arc` and `d3.pie`, with color encoding through `d3.scaleOrdinal` and `schemeCategory10`. A legend with rectangles and text labels shows each year and its corresponding consumption value using custom number formatting. Data is loaded from a CSV URL and sorted descending before rendering.

AI-generated description

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

See also React Starter.

MIT Licensed

Similar vizzes

Loading thumbnail…

activity9_Question1

This example displays a pie chart of net electricity consumption worldwide from 1980 to 2022, sourced from a CSV file via a GitHub gist. It uses D3 v5 APIs including `pie`, `arc`, `scaleOrdinal`, and `schemeCategory10`. The SVG renders fifteen data slices, with a legend listing years and values formatted with a custom suffix. Data is sorted in descending order before rendering.

BBindumadhavi
90% match
Loading thumbnail…

Task9_Q1

This visualization displays the top 15 countries by net electricity consumption worldwide from 1982 to 2022 as a pie chart, with a color-coded legend listing each year and its corresponding value in Rs. The chart is rendered as SVG using D3 v5, with `d3.pie` and `d3.arc` generating the segments and `d3.scaleOrdinal` with `schemeCategory10` assigning colors. Data is loaded via `d3.csv` from a GitHub Gist, sorted descending, and sliced before rendering.

Aanusharamana0@gmail.com
89% match
Loading thumbnail…

Assignment 2 Pie Chart

This example visualizes the highest electricity consumption by country as a pie chart, with each slice colored and labeled with its consumption value, alongside a legend listing country names and figures. It loads data from a CSV file hosted on GitHub, using D3 v5 APIs including `d3.csv`, `d3.pie`, `d3.arc`, and `d3.scaleOrdinal` to process the data and generate SVG paths, text, and rectangles. The chart is rendered with an inner radius of zero, and styling is applied via external CSS classes.

Jjaswanthreddy2000@gmail.com
84% match
Loading thumbnail…

activity9_task9

This example presents a pie chart visualizing the net power consumption of India’s top 15 states for the financial year 2015-16, with a color-coded legend listing each state’s year and consumption value in watts. The visualization uses D3 v5’s `pie`, `arc`, and `scaleOrdinal` functions to generate SVG paths, while mouseover events log consumption data to the console. Data is loaded via `d3.csv` from a GitHub gist, sorted descending by consumption, and sliced to the top 15 records.

BBindumadhavi
83% match
Loading thumbnail…

activity7.1_q1

This pie chart shows the 2023 share of US electricity generation by energy source, using a color-coded slice for each source with percentage labels and a legend. Built with D3 v7, it loads data from a provided CSV and uses `d3.pie()` and `d3.arc()` to compute slice geometries, rendered as SVG paths with hover tooltips. A total of 560×540 pixels accommodates the pie on the left and a legend on the right, with decorative axis titles for context. The chart is responsive via a `viewBox` and uses `d3.scaleOrdinal` for categorical colors.

Mmohanalaharic@gmail.com
81% match
Loading thumbnail…

Q2 Dinesh Pie chart D3.js!

This D3.js pie chart visualizes global energy consumption by source, displaying percentage shares for coal, natural gas, hydroelectric, nuclear, and renewables. It renders SVG slices using `d3.pie` and `d3.arc`, with `d3.scaleOrdinal` and `d3.schemeSet2` for color encoding. Labels positioned via `arc.centroid` show source names and percentages, while a legend on the right uses colored rectangles. Data comes from an external CSV file loaded with `d3.csv`.

Ddineshsingiri18@gmail.com
80% match
Loading thumbnail…

activity7.1

This example displays a donut chart depicting energy consumption by source in terawatt-hours, with an accompanying legend. The visualization uses D3.js v7 to load a CSV from a GitHub gist, then applies the `d3.pie()` layout and `d3.arc()` generator to render each segment as an SVG path. Each slice is labeled with its energy source, and a legend lists each source, its type, and consumption value in TWh. The chart uses `d3.scaleOrdinal` with the `d3.schemeSet3` color palette for categorical distinction.

GGanesh Gundekarla
79% match
Loading thumbnail…

activity7_question1

This example shows a pie chart comparing the population of the top ten countries, with each slice labeled by its percentage of the total and accompanied by a color-coded legend. The chart is built using React and SVG, with D3 v5 handling the pie geometry and layout. The code uses `d3.arc` to generate the pie slices, `d3.schemeCategory10` for colors, and `d3.format` for percentage labels. Data is loaded from a remote CSV file via `d3.csv` and processed in the `useData` hook.

JJayanth Reddy Sripathi
79% match