GreeNeighborhood

main page

Inspiration

We decided to take on the DRW challenge, which somewhat narrowed down our options. The reason why we chose the theme of transportation and the environment is mainly because we live together in an apartment next to a big highway, where we often see swarms of cars driving past. We asked ourselves how our society could pollute less as well as save space (parking, wide highways, etc.), which lead us to propose a solution.

What it does

Our product takes data provided by the city of Montreal to highlight which neighborhoods/areas on the island are doing well in which aspects of sustainable development and vice versa. The user can choose what aspect to focus on, and the map is colored so that the more polluted areas appear red and the greener ones, well, green.

How we built it

The initial design was done with Figma, before moving on and implementing it using Reactjs. Leaflet was used to set up the interactive map, with a geojson file used to draw the borders.

Challenges we ran into

It was our first time using Leaflet, or using any map library in fact, which meant one of us had to figure out how to do what we had in mind. It was just about finding the right tutorials, but it did take time. Coloring the map according to the data was a problem we struggled with right until the last hour. We debugged quite extensively and repeatedly to find all that was going wrong.