# Coronamap Coronamap is an interactive thematic map that animates the spread of the coronavirus. Check out the [deployment](../../deployments "Deployment").

Coronmap on laptop Coronamap on phone

## Preview

Coronamap preview

Disease data: Johns Hopkins CSSE (https://github.com/CSSEGISandData/COVID-19) ### Date Slider The date slider consisting of several form controls, as follows

The date slider consisting of several form controls, as follows

: Play -

: Reverse - Right-pointing double triangle button

: Move to the next day - Left-pointing double triangle button

: Move to the previous day - Button with circular arrow pointing in a clockwise direction

: Loop -

Range input type positioned to the middle

: Date progress bar - Range input type labeled with fps value and a clock icon to the left

: Playback speed ### Colored Geographical Areas A yellow to red gradient color ramp legend labeled with the range of infected cases

The yellow-orange-red sequential color scheme shows the *number of infected cases*. ### Circle Markers

The size of a circle marker scales to the *number of deaths*. ## Getting Started ### Prerequisites * Node.js ```bash $ yum install nodejs $ yum install npm ``` * Install npm packages ```bash $ npm install ``` ### Development * Watch for updates to code and compile automatically: `npm run develop` * Build the optimized production: `npm run build` * Run all unit tests: `npm run test`