Skip to content

A Panel-based dashboard showing recent shootings in Philadelphia using Altair, Folium, and Hvplot

Notifications You must be signed in to change notification settings

MUSA-550-Fall-2022/philadelphia-shootings-app

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

3 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Exploring Recent Shootings in Philadelphia

This repository includes two example dashboards exploring recent shootings in Philadelphia, using the City of Philadelphia's open data on shooting victims.

Each dashboard includes a slider widget that allows the user to specify how many days into the past to display.

Example #1

This dashboard includes:

  • an Altair bar chart showing the top 20 neighborhoods with the most shootings
  • a choropleth map (made with hvplot) that shows the number of shootings per neighborhood.

Launch instructions

  • The app can be launched on Binder using the "Launch Binder App" button below.
  • The notebook can be viewed on Binder using the "Launch Binder Notebook" button.

badge badge

App #1 Dashboard

Example #2

This dashboard includes:

  • an Altair bar chart showing a histogram of the age of shooting victims, colored by fatal vs. non-fatal shootings
  • a Folium heatmap of the shootings across the city
  • an hvplot line chart showing the daily number of shootings, which can be filtered to view data for a specific time period

Launch instructions

  • The app can be launched on Binder using the "Launch Binder App" button below.
  • The notebook can be viewed on Binder using the "Launch Binder Notebook" button.

badge badge

The app has also been deployed on Heroku: https://philadelphia-shootings.herokuapp.com/

App #2 Dashboard App #2 Dashboard

Deploying this app on Heroku

Heroku makes deployment of arbitrary apps including Panel apps and dashboards very easy and provides a free tier to get you started. This makes it a great starting point for users not too familiar with web development and deployment.

To get started working with Heroku signup for a free account and download and install the CLI. Once you are set up follow the instructions to log into the CLI.

  1. Log in to heroku on the command line by running heroku login. This should prompt you to open a browser and you can log in with your credentials.

  2. Add a "runtime.txt" file that has the name of the Python version you wish to use. To match the Python version used in this class, add a single line with the text "python-3.8.10".

  3. Add a "requirements.txt" file to your dashboard's repository that includes all of the requirements for your project. These will be installed using pip on Heroku.

  4. Add a Procfile file to your repository, which declares which command Heroku should run to serve the app. In this repository, the following command serves the app2.ipynb example and the websocket origin should match the name of the app on Heroku app-name.herokuapp.com which you will declare in the next step:

web: panel serve --address="0.0.0.0" --port=$PORT app2.ipynb --allow-websocket-origin=app-name.herokuapp.com

In this repository, I have specified "app-name" as "philadelphia-shootings" but you should replace your "app-name" with whatever you want yours to be.

  1. Create a heroku app using the CLI ensuring that the name matches the URL we declared in the previous step:
heroku create app-name

Again, "app-name" should be whatever you chose in the last step.

  1. Add the files to the repository:
git add .
git ci -a -m 'adding files to repository'
  1. Push the app to heroku and wait until it is deployed. From the main folder of your repository, run the following command from the command line:
git push heroku main
  1. Visit the app at app-name.herokuapp.com