Skip to main content
SimilarExport ZIP
100%

Task 5

✓ Published0🌍 Public
VVinish Reddy Kamireddy
Last edited Apr 26, 2024
Created on Apr 26, 2024
Forked from Hello VizHub

A bar chart compares air quality index (AQI) to total deaths per million for the first 14 countries in the CSV dataset. Bar heights encode death rates while bar colors shift from blue to red based on AQI value. The visualization uses D3.js version 7, specifically the `d3.csv`, `d3.scaleBand`, `d3.scaleLinear`, `d3.axisBottom`, and `d3.axisLeft` APIs. Hovering over a bar displays a fixed tooltip via mouseover and mouseout events.

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…

Project Task 5

A bar chart visualizes the relationship between air quality index (AQI) and total deaths per million across 14 countries, with bar height representing mortality and color encoding AQI levels. The visualization uses D3 v7 to load CSV data via `d3.csv`, create SVG scales with `d3.scaleBand` and `d3.scaleLinear`, and render axes with `d3.axisBottom` and `d3.axisLeft`. A fixed-position tooltip displays country-specific details on mouseover.

Cchandrikachowdary867@gmail.com
93% match
Loading thumbnail…

Task 4

This example presents a multi-line chart tracking total COVID-19 deaths over time for the first 20 countries in a filtered dataset. It loads data from a remote CSV file and uses D3 v6 to render SVG paths, with an ordinal color scale distinguishing each country and a legend identifying them. The code employs `d3.csv`, `d3.timeParse`, `d3.scaleTime`, `d3.scaleLinear`, `d3.axisBottom`, `d3.axisLeft`, and `d3.line` to build the visualization. The rendering approach uses a standard SVG container with configured margins for axes and labels.

VVinish Reddy Kamireddy
80% match
Loading thumbnail…

Task 1

This visualization displays a horizontal bar chart comparing COVID-19 total cases per million across the first 20 countries from the dataset, with each bar's length representing case counts. Hovering over a bar reveals a tooltip showing that country's fuel price per liter. The chart is rendered as an SVG using D3 v6, with d3.scaleBand for the categorical country axis, d3.scaleLinear for the quantitative case axis, and d3.csv to load the data.

VVinish Reddy Kamireddy
78% match
Loading thumbnail…

Project Task 4

This example visualizes total deaths over time for up to 20 countries, using a multi-line chart with a categorical color scheme and a legend. It loads CSV data from a remote GitHub repository and parses dates using `d3.timeParse`. The visualization is built with D3 v6, using `d3.scaleTime`, `d3.scaleLinear`, `d3.line`, and `d3.axisBottom`/`d3.axisLeft` to construct axes and paths within an SVG canvas.

Cchandrikachowdary867@gmail.com
77% match
Loading thumbnail…

Task9 Questin 1

This pie chart shows the top 10 countries by deaths from air pollution in 2020, with each slice labeled with the death count in thousands and a corresponding legend. The visualization uses D3 v5’s `pie` and `arc` generators to create the chart, `scaleOrdinal` for slice colors, and `csv` to load data from a GitHub repository. Slices and legend items are rendered as SVG elements, with text labels positioned using `arcGenerator.centroid`, and the legend displays country names alongside their death totals.

Mmanohar varma
76% match
Loading thumbnail…

Project Task 1

This example shows average PM2.5 AQI values for various countries as a horizontal bar chart, with each country’s bar length proportional to its pollution level. The visualization uses React for component structure and D3 v5’s `scaleBand` and `scaleLinear` for positioning, while `csv` loads pollution data from a GitHub-hosted CSV. The SVG bars are rendered as `rect` elements, with axes built from `AxisBottom` and `AxisLeft` components that call `xScale.ticks()` and map over `yScale.domain()`. Tooltips are provided via SVG `<title>` elements.

MMichael Biancardi
76% match
Loading thumbnail…

covid deaths

This example displays a bar chart of total COVID-19 deaths for fourteen countries, with a steelblue bar per nation and a numeric label above each bar. The chart uses D3 v7’s `scaleBand` and `scaleLinear` to map countries and death counts, while `d3.axisBottom` and `d3.axisLeft` render the axes. Interactive tooltips appear on mouseover, showing the country name and formatted death total. The visualization is rendered as an SVG, with data hard-coded in the script.

HHarinathChakali33@gmail.com
76% match
Loading thumbnail…

Fork of Task 8 Ques 1

This visualization presents a pie chart of mental health death rates across various countries, using data from a local CSV file. The chart uses D3.js (v7) to generate the SVG, with `d3.pie()` computing arc angles and `d3.arc()` rendering the paths. A categorical color scale (`d3.scaleOrdinal` with `schemeCategory10`) maps countries to colors, and a legend lists each country with its corresponding color. The data is fetched via the Fetch API, then parsed using `d3.csvParseRows`, with values converted to numbers for the pie layout.

Aaadesh.pranesh@gmail.com
76% match