Skip to main content
SimilarExport ZIP
100%

7

✓ Published0🌍 Public
Hharisankarakeluth@my.unt.edu
Last edited Apr 24, 2024
Created on Apr 24, 2024
Forked from sample

This example displays a bar chart comparing total COVID-19 deaths across 14 countries, with steel-blue bars sorted by country name and labeled with their precise totals. Built with D3 v7 and SVG, the visualization uses `d3.scaleBand` for the x-axis, `d3.scaleLinear` for the y-axis, and D3's `axisBottom` and `axisLeft` to render the axes, with bars and labels appended directly to the SVG elements.

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…

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
91% match
Loading thumbnail…

6

This bar chart shows total COVID-19 cases for 14 countries, with values labeled above each bar. It uses d3.scaleBand for the x-axis, d3.scaleLinear for the y-axis, and d3.axisBottom/d3.axisLeft to render the axes. Bars are drawn as SVG rectangles with a steelblue fill, and case numbers are formatted with toLocaleString. The chart includes a title and uses the d3.selectAll pattern to bind data to elements.

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

Covid-19 Data Visualization

This visualization displays total COVID-19 case counts for fourteen countries using a bar chart. Each bar’s height and value labels are mapped through d3.scaleBand and d3.scaleLinear, while d3.axisBottom and d3.axisLeft render the axes. Tooltips appear via mouseover events, and the SVG rendering includes a title and case number annotations. The data is embedded in the code as a static array, with cases formatted using the toLocaleString method.

AAbdul Kareem
82% match
Loading thumbnail…

covid-19 bar chart

This bar chart displays total COVID-19 case counts for different countries, with bars colored using a categorical palette and labeled with case numbers. It shows tooltips on hover containing country and total case information. The visualization uses D3 v7 to build the SVG, employing `d3.scaleBand` and `d3.scaleLinear` for axes, `d3.axisBottom` and `d3.axisLeft` for ticks, and `d3.schemeCategory10` for bar colors. The underlying data is embedded directly in the source code.

HHarinathChakali33@gmail.com
81% match
Loading thumbnail…

ICE -6 Bar Chart

This bar chart displays the total COVID-19 deaths for the top ten countries, sorted in descending order and colored with D3’s `schemeCategory10` palette. It uses an SVG rendered via D3 v7’s `scaleBand` for the x-axis and `scaleLinear` for the y-axis, with axes added by `d3.axisBottom` and `d3.axisLeft`. A manual legend maps each country’s name to its colored rectangle. The data is loaded from a CSV file using `d3.csv`.

MM Hema
81% match
Loading thumbnail…

Top 10 Covid 19 Deaths

This bar chart displays the top 10 countries by COVID-19 deaths, with each bar’s length proportional to the death count from the included CSV data. The visualization uses D3 v5’s `scaleLinear` for the x-axis, `scaleBand` for the y-axis, and renders as SVG with `axisLeft` and `axisBottom` helper axes. The chart is composed of steel-blue rectangles positioned via the band scale, while margin-based spacing and explicit axis transforms structure the layout.

Ooabundes
80% match
Loading thumbnail…

gw

This visualization shows the top 10 countries by cumulative COVID-19 deaths, using horizontal bars scaled by total deaths. It renders an SVG bar chart with d3.scaleLinear for the x-axis and d3.scaleBand for the y-axis, styled with custom CSS. The data comes from a CSV file sourced from Worldometers, and the chart includes a formatted x-axis with d3.format and labels for the chart title and axis. The code uses D3 v6 within a React framework.

Sserjunfan
80% match
Loading thumbnail…

ICE-6.js

This bar chart displays COVID-19 death counts by country, with a horizontal layout where each bar's length is proportional to the number of deaths. The visualization uses D3 v7’s `scaleLinear`, `scaleBand`, `axisLeft`, and `axisBottom` to map the CSV data to an SVG canvas. A margin-based coordinate system positions the axes and cyan-filled rectangles, while the data is loaded via `d3.csv` and rendered as a static, non-interactive graphic.

Jjayanthamol99
80% match