uiuccrimemap's Introduction

UIUC Crime Map

Introduction

The goal of our project is to create a simple web application that displays crimes recorded on the University Police Daily Crime Log. Our goal is to provide members of the UIUC community with an easy way to identify areas where crimes are occuring so they can be avoided. We were initially inspired to do this because of the rise in Asian Hate Crimes occuring in neighborhoods we thought were safe. We wanted a way to bring awareness and promote safety in our communities and this seemed like the best way to do so.

Design Process

In our project we used react.js to create a front end and display a map with leaftlet.js and react-leaflet.js. For our backend we used the express.js package, and for our database we used MongoDB Atlas. To fetch the pdf we use selenium and beautifulsoup4. For decrypting the pdf, we are using tabula.py in python, as well as Geocoding with the Google Maps API in order to convert street addresses to latitude and longitude for the front-end. Finally we are using pymongo to connect our python program with the MongoDB Atlas database.

Features

As of now our features include a homepage with a map displaying markers with popups showing crime info. We also have a legend describing what each color of marker refers to and linking to maps that only have those markers displayed. We have a Time of Day Slider that can be used to see crimes withing a certain time range and a Crime Threshold Slider that can be used to set a custom date range the colors of the markers. We also have a brief description of the project on our about page as well as introductions to each of the team members on our team page.

How to Run

Backend (API)


yarn // to install dependencies in package.json


yarn start // starts the backend server (no need to open this in a browser)

Frontend (Client)

Open a new terminal to make sure your backend is still running.


cd mapclient


yarn // to install dependencies in package.json


yarn start // starts the frontend in a browser

uiuccrimemap's People

Contributors

Stargazers

Watchers

uiuccrimemap's Issues

Map not updating

It seems like the map is not being updated for some reason. The latest crime date I could find is 5/29/2021.

Combine About and Team pages.

Enable Text Compression for Performance Optimization and Remove Unused JS and CSS

Our website is quite slow, particularly on mobile phones.

According to this evaluation: https://pagespeed.web.dev/report?url=https%3A%2F%2Fuiuccrimemap.herokuapp.com%2F&hl=en ,
we can reduce a significant amount of load time with these optimizations.

Mobile View Logo is Too Big

Legend not showing up in mobile Browser

Add Heatmap

Add a heatmap using MapTiler https://docs.maptiler.com/maplibre-gl-native-ios/Classes-MGLHeatmapStyleLayer/

Good work

Amazing outcome, appreciate your job!

Logo needs new color

I changed the header color to orange so that it matches the orange-white themed police department website and now the logo is barely visible. I think changing the font color to white could be better.

Deploy with Github Actions

Setting up deployment through Github Actions would be nice as it would make the process more transparent and can make it automated.

Map is not being updated

I suspect that the map is only being updated when the map gets deployed (when we merge a new pull request). I have purposely not made any commits for the past two weeks and now the map does not have any recent data. I think we need to find a way to make the map re-deploy itself every 24 hours.

Recommend Projects

aayu3 / uiuccrimemap Goto Github PK