Class 8 Intro to Comp Media – “Create Your Own Birding List from Live Data”

I’m a big fan of birds! Not only can they fly, but they are avian dinosaurs, display genetic diversity on a grand scale, and are linked to the health of the environments around us.

This project uses APIs to let you view the latest birds sightings in your location, which are logged by fellow citizen scientists like us. Then you can ask for images of any bird on the list. Eventually I’d like for you to be able to mark whether or not you’ve seen any particular bird, so you can create a list of “birds to see” for yourself.

Here is a video and the sketch itself.

 

 

I’m using two APIs to make this work.

First, I pull in the latest data from Cornell Lab of Ornithology’s citizen scientist platform called eBird.  eBird allows people to create their own birding lists with a phone app. eBird then shares that information with everyone else to use with their own accounts, and through Cornell’s free API services. In my project, I request the latest bird sightings by first creating an API URL that uses the latitude and longitude of Brooklyn. A visitor can also add their own coordinates. However, changing coordinates isn’t always working for other people at the moment. I’m not sure why. I’m also not sure why I had to hardcode “&lat=” in the lat input field, but it works.

Second, I use images from Flickr using their API. To do so, I take the bird name logged by a citizen scientist out of the JSON data that is returned by eBird’s API call. I turn that name into a tag that forms a search term to add to a Flickr API URL that searches their website and returns a JSON file. Then I use that Flickr JSON’s contents to create a SECOND URL for the first photo mentioned in the Flickr JSON file. That second photo URL is what I use to display the image itself.

This was a lot of fun to work on. I’m amazed I can pair together live data into something I’d have fun using!  I also love that this is based on the work of fellow citizen scientists!

Here is my code. I really need to switch over to Atom and Github…

Index.html file

https://gist.github.com/fergfluff/7a235bde9d7a661015f8089149e19b2d

Sketch.js

https://gist.github.com/fergfluff/01b21f8d42e9a37656dcd44b021c46a2