Skip to main content
SimilarExport ZIP
100%

Viz1

✓ Published1🌍 Public
Ssaishruthik2361@gmail.com
Last edited Nov 5, 2024
Created on Nov 4, 2024
Forked from Hello VizHub

This example uses a pie chart to display the distribution of COVID-19 cases across different countries, with each slice sized by the total number of cases. It is built with D3 v6, utilizing `d3.select`, `d3.pie`, `d3.arc`, and `d3.scaleOrdinal` to render the chart as an SVG. Hovering over a slice triggers a tooltip that shows the specific case count and percentage of the total, calculated with `d3.sum`. The data is loaded from a CSV file using `d3.csv`, and a legend is added with colored rectangles and country labels.

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…

Viz_shruthik

This example visualizes the distribution of COVID-19 cases across countries using a pie chart built with D3 v6. It loads data from a remote CSV file and renders each country as a slice, with size proportional to total cases. Hovering over a slice displays a tooltip showing the exact case count and percentage. The code uses d3.pie, d3.arc, d3.scaleOrdinal, and d3.select for SVG rendering, plus an interactive tooltip bound to mouseover events.

Ssaishruthik2361@gmail.com
93% match
Loading thumbnail…

Fork of Pie Chart Covid Proj Viz 3

This visualization shows the distribution of total COVID-19 cases across continents as a pie chart with an accompanying legend, using percentages derived from the total case count. The chart is built with D3 v5, employing `d3.pie` and `d3.arc` to generate the segments, and `d3.scaleOrdinal` for color mapping. Data is loaded via `d3.csv` from a GitHub-hosted dataset, and rendered as SVG with custom tick formatting and styled text labels inside each slice.

SSushmaNamidi@my.unt.edu
86% match
Loading thumbnail…

Pie Chart (ICE 7)

This example displays a pie chart of the top 10 countries with the most COVID-19 cases, using data loaded from a CSV file via d3.csv. The chart is rendered as SVG paths, with each segment sized by the "Total Cases" value and filled using a d3.scaleOrdinal color scale. A legend on the right pairs each country with its total, formatted in thousands (e.g., "1.234K"). The code uses d3.pie, d3.arc, and d3.select to build and position the chart.

AAashish Pandey
83% match
Loading thumbnail…

new shivsai

This example presents COVID-19 statistics through two coordinated D3 v7 visualizations: a pie chart and a bar chart. The pie chart breaks down global confirmed cases by WHO Region, while the bar chart displays confirmed cases per country. Both visualizations load data from the same CSV file using `d3.csv` and update interactively via mouseover tooltips showing detailed case counts. The charts use `d3.pie`, `d3.arc`, `d3.scaleBand`, and `d3.scaleLinear` to render SVG elements, with `d3.schemeCategory10` providing distinct colors for categorical data.

Vvikramkotlo9@gmail.com
83% match
Loading thumbnail…

Assignmnet 7 Pie Chart

This pie chart visualizes the proportion of COVID-19 cases across the top five nations, with each slice labeled with its percentage and a color-coded legend listing country names and values. It loads CSV data from a GitHub gist and renders the chart using D3 v5’s pie and arc generators, with a scaleOrdinal for slice colors. Text labels are positioned via arc.centroid, and the legend is assembled manually with rect and text elements. The SVG is selected and sized from the HTML attributes, and data processing occurs asynchronously with async/await.

AAshrith Kudidhi
82% match
Loading thumbnail…

Fork of pie chart

A fork of a pie chart example visualizes COVID-19 case data from a CSV file, showing three categories (Infected, Recovered, Died) as colored slices with proportional labels and a legend. The D3 v5 code uses `d3.csv` to load the data, `d3.pie` to compute arc segments, and `d3.arc` with an inner radius of zero to generate the paths. Slice colors come from `d3.scaleOrdinal` with a manual range, and text labels are positioned using the arc’s centroid method. The SVG output is centered within a 980×550 canvas.

Ddandudivya98@gmail.com
82% match
Loading thumbnail…

5320-Group25-Vikram

This example presents two interactive visualizations of COVID-19 data. A pie chart displays confirmed cases aggregated by WHO region, while a separate bar chart compares confirmed, death, and recovered counts for the top ten countries. The code uses D3 v7 APIs including `d3.pie`, `d3.arc`, `d3.scaleOrdinal`, and `d3.scaleBand` to render SVG elements. Data is loaded via `d3.csv` from a remote GitHub gist, with legends generated dynamically for both charts.

Vvikramkotlo9@gmail.com
82% match
Loading thumbnail…

Fork of Hello VizHub

This example displays a D3.js pie chart that visualizes the distribution of insurance records by region, rendered as SVG with an accompanying legend and interactive tooltips. The code loads CSV data from a GitHub-hosted dataset using `d3.csv`, aggregates region counts with `d3.rollup`, and constructs the pie with `d3.pie` and `d3.arc`. Hovering over a slice highlights it, triggers a tooltip showing the category and value, and applies categorical colors from `d3.scaleOrdinal` and `d3.schemeCategory10`.

Kkotha.shiva@btech.christuniversity.in
82% match