Hackernoon logoWe Built A Coronavirus Map with COVID-19 Data and Travel Restrictions Across All Countries by@bilevn

We Built A Coronavirus Map with COVID-19 Data and Travel Restrictions Across All Countries

Author profile picture

@bilevnNikolay Bilev

Full-stack engineer. Currently working on routitude.com

Back in March my teammates and I switched from our regular tasks working on a travel platform to building a COVID-19 monitoring service. Here is what we’ve managed to get done so far:

  • A dashboard with frequently updated data for each country and administrative divisions of United States and Russia;
  • Interactive map of the outbreak;
  • Map of travel restrictions imposed by governments;
  • Charts reflecting trajectories of the outbreak in each country
All these features were combined with already existing information on visa requirements, weather statistics and flights.
You are welcome to check the app here: routitude.com, project details are described below.

Background

The idea behind the creation of Routitude was to aggregate in one place all necessary information you might need to choose the best travel destination depending on your preferences.
These parameters include weather conditions for a particular time of the year, direct flights that are available from a selected city, visa requirements and quality of life statistics for countries and cities (safety, prices, etc). Two years ago we started working on this project and during this time we have launched several beta versions and initially planned the main release of Routitude 1.0 by April of this year.
By the end of February it became absolutely clear that the situation with COVID-19 pandemic spreading rapidly was extremely serious. Two weeks later, millions of people all over the world had to stay home and leave traveling for better times.
Since we've been developing infrastructure for displaying and mapping data for countries and cities of the world for the last 2 years, we decided to use this experience to create a COVID-19 tracking service as an extension of our website.
We wanted to focus on something that could be useful for people right now and postponed the release of our travel platform. In two weeks we have collected all required data sources, displayed the information using our infrastructure and released the updated app with coronavirus information.

Main features

At the moment there are two main layers of information on our map:
  • Case statistics layer displaying the number of confirmed and active cases for each polygon of a country or a territory. The colour palette is a value scale and reflects the severity of the outbreak in terms of the number of cases. Inside a polygon we show the total number of cases and 3 day delta indicator for a number of active cases. A breakdown by states and regional divisions is available for the United States and Russia. Detailed statistics as well as historical charts are shown by a click on a country polygon.
  • Travel restrictions layer with 3 different types of measures: travel ban, quarantine measures and non-global restrictions. Notes on specific restrictions can be found in the left panel available by clicking on a country polygon.
The main page on the left panel shows the basic statistics of the COVID-19 global outbreak. The data includes the number of confirmed cases, number of deaths and number of recoveries. In addition, the number of active cases is calculated as a difference between the total number of confirmed cases and the number of recovered or deceased patients, and active case rate as the number of active cases in relation to population, shown in percentages.
Top 5 countries are displayed, sorted by daily growth of one of the above-mentioned indicators. Each country has a separate page inside the left panel with coronavirus spread indicators and historical charts for different measures. Furthermore, it shows travel restriction details and general information about the country such as safety, prices, visa requirements and many more.

Data sources and tools

We use a number of Python Flask microservices for data aggregation and processing. The web app is written with Vue.js framework and our map is based on mapbox. The website is very responsive and mobile friendly.
Historical data for charts and trend indicators comes from a well-known dataset provided by CSSE department of Johns Hopkins University. The dataset is available inside a github repository and organised as a number of text files updated once a day.
The data contains basic statistics for each country (including administrative division of some countries) and dates. We use Python and a popular package for data processing Pandas for fetching this data. A simple code snippet for getting the data for a selected date is shown below.
import pandas as pd

def get_covid_daily_report(report_date):
    """
    Get coronavirus report on date
    :param report_date: requesting date of report (MM-DD-YYYY)
    :return: Pandas DataFrame with data
    """
    report_url = (
        f'https://raw.githubusercontent.com/CSSEGISandData/COVID-19/master/'
        f'csse_covid_19_data/csse_covid_19_daily_reports/{report_date}.csv'
    )
    return pd.read_csv(report_url)

df = get_daily_report('03-15-2020')
Since this data is updated only once a day we can't use it to show the most recent figures during the day. Therefore, in order to display real-time statistics we extract data from a Wikipedia page dedicated to the coronavirus pandemic by country and territory.
To illustrate the approach, I will give a simple code snippet to get up-to-date coronavirus statistics from Wikipedia (the page, as well as the position of the data tables on it, may change in the future, which may require editing the code to make it work).
import pandas as pd
import requests

def get_current_covid_report():
    """
    Get current COVID-19 report
    :return: pandas DataFrame
    """
    page_url = (
        'https://en.wikipedia.org/wiki/'
        '2019%E2%80%9320_coronavirus_pandemic_by_country_and_territory'
    )
    response = requests.get(page_url)
    df = pd.read_html(response.content)[1]
    df = pd.DataFrame(
            df.values[:, 1:5], 
            columns=['country', 'confirmed', 'deaths', 'recovered']
        )
    return df

df = get_current_covid_report()
Data from Wikipedia is also used for the travel restrictions map layer. This information is retrieved from the page of travel restrictions related to the coronavirus pandemic. To parse the page, we use the beautifulsoup4 package.

What is next?

Routitude is a service for travelers who want to find the optimal place for their next adventure. Therefore, as soon as the current crisis is over, we will continue to develop our application adding new features and providing more information on the conditions and opportunities in different parts of the world.
In the meantime, our short-term goal is to provide a tool that helps people get a quick grasp on where things stand around the world with relation to the COVID-19 pandemic. We think our format could be useful for that and hope you think so too!
We look forward to hearing back from you and are ready to answer your questions.
Stay safe!

Tags

The Noonification banner

Subscribe to get your daily round-up of top tech stories!