Our inspiration

New York City is notoriously known to be one of the more dirty areas in the country, and we believe that a big part that contributes to that includes people who can't find a trash can wherever they are walking. People can get lazy trying to find one, and this web app can definitely make it easier for them to do so. It can be a big help to inspiring people to create a greener NYC!

What it does

It displays the locations all the trash receptacles in NYC on a map and allows the user to find the nearest trash receptacle to them. Given permission, it will locate the user's current location and zoom in on that area and the user's current location will be constantly updated. When a marker is clicked, an info window will show up above the marker and will display a description of the location, latitude, and longitude of the trash receptacle location, and a link to Google Maps with the location of the trash receptacle. It will also provide a route to the clicked trash receptacle marker.

How we built it

Uses the NYC Open Data API to get the coordinates of the trash receptacles, Google Maps JavaScript API to place markers according to the coordinates, Font Awesome for the trash SVG, and Amazon Web Services to store the JSON file.

Challeneges we face

We ran into the issue of extracting the JSON data to plot the coordinates. We Also ran into the issue of the route not changing and only adding to the route when clicking on the route. Another issue we ran into was that when a marker was clicked, the info window that was opened was the above the last marker that created. We also had a challenge figuring out how to make the user location constantly update on the map.

What we learned

We learned how to properly extract data from an external JSON file using proper CORS configuration. We also became more familiar with how to implement the Google Maps API and how to get the user location and update it without refreshing the page, how to create markers on the map, and how to attach information to markers and how to create a walking route.

Share this project:
×

Updates