Inspiration
We were walking in the Nature Preserve the other day as a group trying to brainstorm ideas for the hackathon, but we weren't able to come up with anything. That was until we walked back from APP dining hall, and we saw construction workers cutting down trees. We were curious and then wondered "how many trees do get cut down in the US, and how may it affect CO2 levels?"
What it does
A website that informs people about environmental issues including an interactive map.
How we built it
Our map is divided by counties, but in order to incorporate that into the United States, we had to layer the counties together, so that we can assign specific values to each of them. The data that we collected was from globalforestwatch.org in which they track information on forests. We then had to organize the information that they gave, as it was in effectively one large excel sheet, and they divided by years. We made and ran a python script that can automatically sort and organize the data for us, and it can be applied for future documents as well. To represent the data on the map we read from the JSON file to get the value of deforestation/CO2 emission at a certain county. For deforestation we converted the area value to a radius that could be displayed as a circle on the map. These circles represent the size of forests lost in those counties.
Challenges we ran into
There were many different challenges that we ran into: 1)Organizing data in an efficient way We needed to organize the data that we extract using the script, in a way that was efficient with amount of space it took, and more importantly, making it easy to call the information when we put it on the map, for the respective year. ex)Initially we had a structure that took the State -> County -> Year -> Tree Loss : num -> CO2 emissions : num. This was the most optimal with storing information in terms of space it took. However this was inefficient when we wanted to extract information on a year to year basis using the slider. Our second iteration had Year -> State -> Tree loss -> Counties : num per county -> Tree loss :num per county -> CO2 emissions -> Counties : num per county -> CO2 emissions :num per county. However, this was too inefficient with storage space it took, but it was the step in the right direction. Our final iteration had Year -> State -> Tree loss -> Counties : num -> Tree loss :num -> CO2 emissions -> Counties : num -> CO2 emissions :num. Even though it may not look like a significant difference, the change in how we nested the information effectively saved us 40000 lines in our JSON file, and made accessing the information much easier. 2)Reading the JSON file We had a lot of trouble figuring out how to import the data from the JSON file as a dictionary into our JS. First we tried to just fetch the JSON file directly from our local directory into our JS script. But there were permission issues. We then tried learning Node.js to create a local server to run our html and we messed around with that for a bit but nothing we did seemed to work. So we started exploring other ways and eventually we figured out if we run a live server it will be protected by http and we could fetch the file safely. 3)Making data work with the Map A lot of time was spent just getting the data from the JSON, so you can imagine how long organizing and mapping the data took. Most of our trouble was trying to sift through the dictionary, read the right values, and calculate the right units. What made this extra difficult was the fact that our data was extremely large; approximately 3000 counties and their stats over 24 years for both deforestation and carbon emission. So knowing if the values you are reading are correct became almost impossible.
Accomplishments that we're proud of
We are proud of the fact that we managed to organize the data in a visually appealing way using our interactive map. We were able to map values from the JSON file onto the map and have the opacity adjust depending on the amount of tree loss and carbon emissions in each county, which was one of the features we wanted to implement the most. We are also happy with the toggle feature on the map that allows users to change the data on the map depending on whether they wanted to learn about tree loss or carbon emissions trends, in addition to the slider feature we added that adjusts the data on the map depending on the year.
What we learned
We learned a wide variety of skills that we can apply to our future projects, such as how to use git, asynchronous functions in JavaScript, hosting a live server, and more. Since we are new to hackathons, we believe that these technical skills learned through solving the various challenges we faced will aid us in future hackathons and projects overall. A skill that was also very important that we learned was time management. As a team new to hackathons, we were not used to the time constraints associated with these competitions, and how the pressure of an impending deadline impacts our work. However, we also learned how gratifying it can be to complete an entire project within a short amount of time, especially since we were using and implementing new tools that we just learned in a short span of time.
What's next for EMission Environment Team
For the future, we would want to add more information on the map related to other environmental issues, and more corresponding sections on the website where people could learn more about these issues and ways they can help. We believe that more data about a wider variety of issues would allow us to spread more awareness about the impact of these issues on our environment, show people the reach of these issues in the US through the map feature, and provide ways for people to start protecting our environment with small changes at home.
Log in or sign up for Devpost to join the conversation.