Skip to main content
SimilarExport ZIP
100%

covid vaccines

✓ Published0🌍 Public
Bbhargav83
Last edited Mar 12, 2023
Created on Mar 12, 2023

This visualization displays total COVID-19 vaccinations by location, using a bar chart where each bar is colored by vaccine manufacturer. The chart ranks locations from highest to lowest vaccination totals, with tooltips revealing precise values on hover. Built with the Vega-Lite API on top of D3.js v5, it loads CSV data from a GitHub gist and renders as an SVG canvas. The code customizes axis tick colors and font styles through a config object to improve readability.

AI-generated description

A visualization constructed using the vega-lite-api. Practice with Covid Vaccine data

MIT Licensed

Similar vizzes

Loading thumbnail…

visualization project3

A scatterplot maps COVID-19 vaccination totals by location and vaccine manufacturer, with circle size and opacity encoding total vaccinations and color distinguishing categories. Built with the vega-lite-api, it registers Vega-Lite and vega-tooltip, loads CSV data from a GitHub gist via d3.csv, and applies a custom config for axis styling and font sizes. The visualization renders responsively to the full window using SVG output.

Ssofigg
86% match
Loading thumbnail…

Practice Covid Vaccine data of Vega-Lite API Template

This example visualizes Covid-19 vaccine data by manufacturer using an interactive bar chart built with the Vega-Lite API. It shows the total vaccination counts for each location, colored by vaccine type, with tooltips displaying quantitative totals. The code loads CSV data via `d3.csv`, configures axes and styling through `config.js`, and renders the chart using `vl.markBar` and `vl.encode` chaining. The visualization adapts to the window size and uses Vega-Lite’s SVG renderer with tooltip support.

Ssmile2git
85% match
Loading thumbnail…

Covid - 19

This visualization displays the total number of Pfizer/BioNTech vaccinations administered in 11 countries as of May 27, 2021, using a horizontal bar chart rendered with SVG. The chart uses d3.scaleLinear for the x-axis, d3.scaleBand for the categorical y-axis, and d3.axisLeft and d3.axisBottom for the axes. Data is loaded from a local CSV file with d3.csv, and the bars are colored with a fixed steelblue fill via CSS. The code imports D3 modules directly and appends rectangles to the SVG container.

IIc1200010
82% match
Loading thumbnail…

Fork of Vega-Lite API Template

This visualization displays COVID-19 vaccination data, plotting total vaccinations against daily raw vaccination numbers, with points colored by date and sized by daily vaccinations. It uses the Vega-Lite API to construct the chart programmatically, registering with Vega and Vega-Lite, while loading data from a CSV via d3.csv. The visualization reads vaccination records from a Gist-hosted dataset, rendering an interactive scatter plot with tooltips that reveal location information, with custom configuration for axis styling and typography.

GGerasimos Katsagannis
82% match
Loading thumbnail…

Why play

This bar chart shows total COVID-19 vaccination counts by manufacturer across given countries, as of May 19, 2021, with Pfizer/BioNTech leading by a wide margin. The visualization uses D3 v5’s `scaleLinear`, `scaleBand`, `axisBottom`, and `axisLeft` to map vaccination numbers to bar lengths along a log-free linear scale, with a custom `.tickFormat` for compact labels. Horizontal bars are rendered as SVG rectangles, and the data is loaded from a CSV file via `d3.csv`.

GGeorgeVard
81% match
Loading thumbnail…

Fork of Vega-Lite API Template

This example visualizes global COVID-19 vaccination progress, plotting total vaccinations over time and colored by vaccine type, with tooltips revealing country ISO codes. Built using the Vega-Lite API for D3, the code registers Vega-Lite specifications with `vl.markPoint` and encodes the data through `vl.encode`. The visualization loads CSV data via `d3.csv`, applies a custom configuration for axis styling, and renders to an SVG canvas with interactive tooltips handled by the `vega-tooltip` `Handler`.

GGerasimos Katsagannis
79% match
Loading thumbnail…

Fork of Vega-Lite API Template

This example visualizes COVID-19 vaccination data, plotting total vaccinations against people vaccinated as a scatter plot with tooltips showing location names. Built with the Vega-Lite API and D3.js, it registers Vega and Vega-Lite, loads CSV data via `d3.csv`, and renders an interactive SVG chart that fills the viewport. The visualization applies a custom configuration for axis styling and tooltip formatting, using a dark color scheme for labels and titles.

GGerasimos Katsagannis
79% match
Loading thumbnail…

Data visualizations

This visualization uses D3 v5 to display cumulative COVID-19 vaccination totals over time for multiple countries, with each country represented by a distinct colored line. The line chart employs a time-based x-axis and a linear y-axis scaled to billions of vaccinations. The code uses `d3.csv`, `scaleTime`, `scaleLinear`, `scaleOrdinal`, `nest`, and `line` with `curveBasis` to render the SVG paths, while a custom color legend function shows the country categories. Data comes from a GitHub-hosted CSV of vaccination records.

GGerasimos Katsagannis
78% match