Skip to main content
SimilarExport ZIP
100%

data visualization bubble chart

✓ Published0🌍 Public
Bbudalavijay2001@gmail.com
Last edited Apr 22, 2024
Created on Apr 22, 2024
Forked from Hello VizHub

This example visualizes COVID-19 cases, deaths, and population across countries using a bubble chart. Each bubble’s position maps total cases on the x-axis and total deaths on the y-axis, while bubble radius encodes population via a square-root scale. The chart is rendered in SVG using D3 v7, with linear scales, axis generators, and a legend showing population magnitude. Data is loaded asynchronously from a remote CSV file using `d3.csv`.

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…

data visulalization Scatter Plot

This scatter plot visualizes COVID-19 cases by country, plotting total deaths against total cases. Each circle represents a country, with color encoding the continent, and the plot includes axes, labels, and a legend. The code loads CSV data from a GitHub repository, uses D3 v7 scales and SVG rendering to position the circles, and employs `d3.axisBottom` and `d3.axisLeft` to generate the axes.

Bbudalavijay2001@gmail.com
85% match
Loading thumbnail…

data visualization project

This example presents a bar chart of COVID-19 total cases by country, using data loaded from a remote CSV file. The chart is rendered as an SVG element using D3 v7, with a rotated x-axis to accommodate country labels and a linear y-axis for case counts. The code demonstrates D3’s scaleBand and scaleLinear for axis scaling, and uses the `join` operator to efficiently create bar rectangles, with a steelblue fill for the bars.

Bbudalavijay2001@gmail.com
85% match
Loading thumbnail…

Let's make a map

This interactive map visualizes COVID-19 case and death counts by country, with bubble sizes scaled to total cases and colors indicating severity. Users can zoom and pan using d3.zoom, while hovering over bubbles reveals detailed statistics via tooltips. The visualization combines a Natural Earth projection using d3.geoNaturalEarth1 and d3.geoPath, with geographic data loaded from the world-atlas TopoJSON and COVID-19 statistics from an external dataset. Countries are rendered as SVG paths with hover highlighting, and the animated bubble layer uses d3.scale.sqrt and linear color scales for proportional encoding.

Ssureshreddypr
83% match
Loading thumbnail…

Project Task 3

A bubble chart plots the first 30 countries from a CSV dataset, comparing COVID-19 total cases per million on the x-axis against population density on the y-axis. The circle sizes encode consumption values, and color distinguishes each country via d3.scaleOrdinal with d3.schemeCategory10. Interactive tooltips display exact values on mouseover. The visualization uses D3 v7 (d3.csv, d3.axisBottom, d3.axisLeft) with SVG rendering, filtering out countries with population density over 1000.

Cchandrikachowdary867@gmail.com
83% match
Loading thumbnail…

VIZPROJECT_i2

This bubble chart visualizes the relationship between new COVID-19 cases, population density, and GDP per capita across multiple countries. Each circle represents a country, positioned along the x-axis by new cases and the y-axis by population density, with circle size encoding GDP per capita. Color distinguishes individual locations. The visualization uses D3 v7’s `scaleLinear`, `scaleSqrt`, and `scaleOrdinal` to map data dimensions, and an SVG-based tooltip displays detailed values on hover. Data is loaded from a CSV file, and the chart is rendered entirely with SVG elements.

Jjarethodges@gmail.com
82% match
Loading thumbnail…

covid data viz

This example plots COVID-19 data from the Our World in Data CSV as a scatterplot, with new cases on the x-axis and deaths on the y-axis. It uses D3 v7 to load the CSV, slice the dataset to a manageable subset, and append circles to an SVG. The code samples the raw data by taking every thousandth row, and scales the plot area with fixed margins, though the scales are incomplete.

NNita
82% match
Loading thumbnail…

VIZPROJECT

This bubble chart visualizes the relationship between new COVID-19 cases, population density, and GDP per capita across countries. Each circle’s position encodes the first two variables, while its radius scales with GDP, and color distinguishes nations. The visualization uses a D3 v7 CSV load, linear scales for axes, a square-root scale for bubble size, and an ordinal color scheme. Interactive tooltips appear on mouseover, displaying exact values per country.

Jjarethodges@gmail.com
81% match
Loading thumbnail…

Project_2

A choropleth-free, year-wise grouped bar chart visualizes COVID-19 metrics—total cases, deaths per million, and population density—for a user-selected country. The interactive dropdown filters data loaded from `cleaned_covid_data.csv`, using `d3.csv` with time parsing. Rendering in SVG, the chart employs `d3.scaleBand` for grouped bars, `d3.axisBottom` and `d3.axisLeft` for axes, and tooltips that display values on hover. Population density, often dwarfing case/death counts, shares the y-axis, revealing scale discrepancies across years.

Jjyothirmai318@gmail.com
81% match