Designed by Amanda Hernández and Devika Govindarajan
GitHub Pages: https://amandavhernan.github.io/group_18_final_project/
Our target browsers are IOS, Android, and Chrome. Since we want our website to be compatible with the most popular browsers so that more people can use our website. While you can still access our website on your phone, it works better with a laptop or desktop because a smaller screen wouldn't be able to capture and showcase all the important information at the same time.
We used the live crime incidents dataset housed inside Prince George’s County Open Data Portal. The dataset spans a roughly five year period from 2017 to 2022 (present) and is updated weekly. The dataset includes information about the type of incident, when and where the incident was reported, and what reporting area, beat, and sector the incident belongs to.
API (JSON): https://data.princegeorgescountymd.gov/resource/wb4e-w4nf.json
The main visualization of our website is the filterable Leaflet.js map. Our map is accompanied by a filter to search different types of crimes. Once you load the data, a list of 30 crimes appear along with corresponding markers of where they occurred. You can search/filter by specific types of crimes in the filter box. The markers on the map are color coded by type of crime so that is is easier for users to distinguish between them. When you hover over the markers, they show the approximate location of where the crime occurred as well. We also embedded two Tableau maps that display the different police sectors by district as well as the police department locations.
Our project primarily uses Leaflet.js. We also used Tableau to embed a dashboard that houses two additional maps. Another tool we used is Geoapify’s Marker Icon API Playground to create custom markers for our Leaflet.js map. This tool is free and only requires the use of an API key.
Marker Icon API Playground: https://apidocs.geoapify.com/playground/icon/
We used Flexbox to design our site and make it responsive to various screen sizes. The flexboxes allowed us to style the layout exactly how we intended and it was a big component of our website.
The idea behind the project came from an understanding that some police departments are notorious for releasing skewed or misleading crime statistics. This is an information problem that affects many communities across the United States. This is an issue because crime data may contain inconsistencies that make it easy to misinterpret and spin facts or data in a way that elevates political agendas instead of community-based solutions. Additionally, biased crime data can lead to the spread of harmful stereotypes about certain areas or communities and the people who live there. Our dashboard serves as part of the solution to this information problem by offering users the opportunity to explore crime incidents on a map and view additional details such as where the crime was reported.