/covid-data-viz

Using https://experiments.withgoogle.com/chrome/globe

Primary LanguageJavaScriptApache License 2.0Apache-2.0

Covid Data Viz

D3 visualizations

In the root of this repo, contains D3 charts related to the data available from CSSEGISandData repo The data is downloaded from github into the browser and parsed there. View online

Screenshots

From Day 1

Shows data from the start of the pandemic. FromDay1

From Patient zero

Shows how the spread compares between the countries since their first confirmed infection. FromPatient1

threejs visualizations

The data for ThreeJS is parsed and files in threejs/data/ are generated on each run, this is for now a daily operation. The date can be changed on the browser so that we can see through time each dataset and how it changes. When a new date is selected, the top field is centered (unless the "autofocus" toggle is set to false.

View online

Screenshots

Confirmed dataset

The start state, showing the cumulative confirmed records, centered on the current day's top location and showing a D3 graph for the confirmed history

threejs-start-confirmed

Focusing other countries

Moving the globe is done with the mouse, click and hold and rotate. If there are known regions close to the centered view, the closest region will appear and the D3 graph will be updated. threejs-focusing-other-countries

Available datasets

The available datasets are:

  • Confirmed
  • Deaths
  • Recovered (There is no specific file dedicated to US recovered (only global dataset exists))

threejs-available-datasets

Accesing the deaths dataset

threejs-deaths

Cases vs country population percent dataset

Using the worldometers population for 2020, the percentage of affected cases is shown. This is experimental, the data in worldometers is per country and the data in the CSSEGISandData is sometimes over a specific country's location. This should be fixed soon. threejs-percent-population

Available aggregations

Based on the time_series cumulative data, we can infer certain numbers:

  • Cumulative: raw value acquired
  • Daily: The increase/decrease of the value per day in the cumulative
  • Daily delta: The previous day's value vs the current day's value threejs-available-aggregations

Accesing the daily aggregation

When the bars are green, it shows the daily values fora location is doing better (less infections, less deaths, more recovered) When the bars are light-blue, it means the current day increment is zero threejs-daily

Accesing the daily-delta aggregation

Same logic of colors of green/light-blue as daily-aggregation. This is the daily from the day before to the current day. threejs-daily-delta