See Ahead of the Curve, a COVID-19 Visualization Tool

Try it yourself: https://dennisren.com/COVID19

I built this tool to better visualize COVID-19 data through the lens of simple mathematics. I hope you find the graphics helpful when trying to get a grasp on this complex situation. This is a good faith project, please use with discretion

I first built the UI on some existing data APIs, but later I found none is consistent enough for from day to day. No one is to blame, it is a rapidly evolving situation. So I decided to build my own data engine based on raw datasets from Johns Hopkins University

What it does

The front end provides a user-friendly interface to browse and explore all known locations that have been affected by the virus. The dropdown menu allows you to browse through the various regions in the world. A logistic curve is fitted onto the actual data with a least-square optimizer.

The Math

Fitted Logistic Curves

*For beginners check out this Video by 3Blue1Brown on the math behind pandemic growth

The total confirmed, deaths, and recovery curves of a pandemic roughly follow a logistic curve over its course in a community. Of course, there are a lot more factors that come into play when modeling an pandemic. This study makes NO attempts to account for explicit factors.

Each curve in the dataset is fitted to the following ideal logistic model

In this model, A accounts for the amplitude of the curve, essentially predicting the ceiling of the pandemic

𝜇 represents the center of the logistic curve, it marks the estimated inflection point of the pandemic

𝜎 represents the growth factor of the curve, aka the “sharpness”

Each curve is fed through a least-square gradient descent optimizer against the ideal model to compute the parameters. Note that not all datasets can be successfully fitted, the optimizer can’t converge on those datasets with too little data points or non-ideal shape.

I decided to plot ahead of the fitted curve 10 days ahead of now so you could visualize the current trend. Please also note that this is NOT a prediction of the course of the pandemic, it’s merely a rough forecast from the currently known data points. No one can predict the future.

Derivatives of Logarithmic Data

During exponential growth, the log plot shows a linear growth. The slope of the log chart, therefore, informs the speed of the growth. The slope chart s(t) is defined as

Similar logic follows. In a polynomial function, the second derivative indicates concavity. The second derivative of the linearized data gives us the concavity of the growth curve. A positive value on this curve means accelerating spread, while negative value points to the decelerating spread. The concavity chart is defined as


How I built it

The server side sits on a Django MVC backend. I’ve created a data processor to aggregate JHU’s raw daily reports into time series correlated with locations. All data is saved and served from a mysql database with schemas defined in the Django model. The backend also has a curve fitting engine which computes logistic curve parameters give a set of input data points.

The front end leverages Materialize CSS as the main UI framework. Of course, all the heavy lifting in logic is done ins JS with the help of JQuery. The charts are plotted in chart.js.

Challenges I ran into

The biggest challenge of this project was to find a clean data source that would display the time series accurately and consistently. Initially, I leveraged my frontend off of existing open source APIs. However, due to the rapidly changing nature of the situation, the existing data APIs can not provide a consistent data set over time. So I decided to build my own from JHU’s raw data sets. My data processor is very robust and resilient against data format changes, key changes, etc.

What I learned

Stay away from unreliable Data APIs. If you do end up building one, make sure your API is smart enough to resist some degree of inconsistency from the raw data source. Use a database to properly manage your data, use tricks like avoiding duplicate entries, using unique ID to identify your entry, etc…

Closing Remarks

This app was also submitted to the COVID-19 Global Hackathon, please give me a heart if you found this tool helpful! https://devpost.com/software/covid-19-timeline-with-logistic-curve#updates

I plan to run this app off of my website indefinitely. Data will be updated on a daily basis. Hope you all stay happy and healthy!

Happy hacking!