codewritingcow/hrnyc20-mvp-map-app

Interactive online map of gun homicides in New York City

NYC Gun Homicide Map

This repository contains the source for a Leaflet.js map displaying locations of gun homicides in New York City for the current year.

Each map marker contains an incident date, location and demographic information of victim and suspect. Data comes from an NYPD dataset on shooting incidents.

A dropdown menu allows users to display gun homicides by year (2006 to present).

The repository also contains the code for a Node.js server, which fetches incident data from the Socrata Open Data API. The server then returns the data to the map. The live server is hosted on Heroku.

This map was a MVP project for Hack Reactor NYC Cohort 20.

Requirements

External API Key

• This project uses Socrata Open Data API to access the city's dataset. To get an API key, visit: https://dev.socrata.com/docs/app-tokens.html
• A Socrata account is required to get an API key. To open an account, sign up: https://opendata.socrata.com/signup

Key Dependencies

• Node.js with Express.js web framework
• Leaflet.js library for mobile-friendly interactive maps

TODO

• When user clicks a marker, the app displays URLs to news stories related to the incident.

Author

Gary Pang - garypang.dev

References

• NYPD Shooting Incident Data (Year To Date) Public Safety from NYPD and NYC Open Data
• Socrata Open Data API documentation

hrnyc20-mvp-map-app's Issues

Migrate from JavaScript to TypeScript

Migrate application to TypeScript to take advantage of its support for strong typing, and to reduce type errors.

Map not displaying current year homicides

Bug

The map is showing the "Number of Gun Homicides in 2022" (the current year) as zero. It is also not loading any map markers of homicide locations.

However, the map still shows the correct number and map markers for previous years.

The problem is due to an update to the API for current-year shooting incidents. The URL param statistical_murder_flag originally had a value of true or false, but now the value is either Y or N.

When the map app requests data for incidents where statistical_murder_flag matches true, the API finds no matches. Therefore, the API returns an empty array as the response to the map app. See screenshots of data response:

Solution

• This map app is still using the old true flag: https://data.cityofnewyork.us/resource/5ucz-vwe8.json?statistical_murder_flag=true
• It should use the new Y flag: https://data.cityofnewyork.us/resource/5ucz-vwe8.json?statistical_murder_flag=Y

Caveat

To add to the confusion, the API for historic shooting incidents still uses true or false for statistical_murder_flag

• https://data.cityofnewyork.us/resource/833y-fsy8.json?statistical_murder_flag=true

Upgrade Leaflet to v1.8.0

The gun homicide map is still using Leaflet v1.4.0. Let's upgrade to the latest version (v1.8.0).

Save search results to database

Add database to Heroku dyno, and save search results to the DB. This decrease the number of HTTP requests sent to the NYC Open Data API. See issue #10, "Improve server speed with Redis caching."

Display URLs to news stories

When users click a map marker, the app should display URLs to news stories about the incident.

The URLs would have to be stored in a database.

On the NYC Open Data API, each incident has a unique INCIDENT_KEY. That key can be used as a reference key in the database for the map app.

Improve server speed with Redis caching

Implement Redis to decrease the number of HTTP requests sent to the NYC Open Data API.

When users view homicides for a selected year, the server should look for those records in the Redis cache first. If the records aren't cached, the server should query the Web app's database.

If the DB doesn't have those records, only then should the server send a GET request to the external API.

Display homicides from past years

Add UI for displaying homicides from past years. Currently, the map shows only deaths from the current calendar year.

To implement this feature, the map's server must be modified. The server only fetches data from the NYPD Shooting Incident Data API (Year To Date), but it also needs data from the NYPD Shooting Incident Data API (Historic).