Geographic Information in the Browser

I took an introduction to GIS class through Grad School and it was pretty cool!

Even though a majority of what we learned was in ArcGIS, I made some cool maps using Leaflet.js that I wanted to share.

Tree Survey

The class collected data using a novel tool called Epicollect5 that I had never heard of before but I will definitely utilize for school in the future. In a nutshell, it is an easy-to-use platform that allows you to create simple data collection apps and surveys that you can distribute as web apps or even phone apps. If you’re a student learning front-end development, this is an excellent tool to survey and collect data to be retrieved via a JSON REST API.

The map!

The blue bounding box was a Leaflet polygon drawn by me to help direct my fellow students on where they were supposed to collect the data. Each green dot represents a tree for which data was collected. If you click on any individual green dot then a popup will provide you the information that was collected about each tree: Diameter of the trunk (in measured inches) Height (Categorized) Health (Categorized) Observable Damage (Binary) The blue marker was the location of our classroom.

Final Project

My final project was a Systems Engineering approach to various GIS systems to compare and contrast their capabilities and costs.

Another Leaflet Map I made was simply a mapping of the Capital BikeShare Dock API. This includes up-to-date information about the number of bikes that are currently available at each station as well (presumably you could include some clever JS/CSS filtering to use different icons based on availability, this is likely what nearly every major scooter/bikeshare app is using now.

The map!

Conclusion

Leaflet was super easy to use and I can’t wait to explore some other ways to use it. A couple ideas I have in mind already:

Volunteering geographic information through the browser’s underlying hardware integrations:

Average Wifi Speeds for Coffee Shops and Libraries
Some interesting heat maps and visualizations to sit on top of this data.
Geolocation Browser API for collecting additional location data
An interesting experiment in virality of objects, handing out QR code stickers at a conference and seeing where they end up geographically!

Geographic Information in the Browser

Comments

More from this blog

Predictions for AI in 2023

DevOps Paradigms and Practices for 2023

Writing in 2026

How to Read More

LinkedIn Network Exploration Using Qlik Sense

Tree Survey

Final Project

Conclusion

Command Palette

Comments

More from this blog

Tree Survey

Final Project

Conclusion