Lab 5 - Leaflet.js

In this week's lab assignment, we learned how to reference and use external GeoJSON data, as well as learn how to style GeoJSON layers.

Specifically, we were provided an .html template and two .js extension files in GeoJSON format--the latter of which are spatial data (polygons) with interpolated values (in GRIDCODE) based on sampled nitrogen levels at water sampling stations along Bayou Texar on the east side of Pensacola, Florida.

Within the .html template, I referenced the external GeoJSON files and then created two Leaflet layer variables to hold the GeoJSON data. Below is a screenshot of my updated .html page as it is running through my Apache localhost. This view of the data facilitates an understanding of the spatial distribution of water quality on the given sampling dates by allowing the user to have control. The Layer Control button gives the user the option to toggle between different imagery and/or by turning data layers on/off. This user-interactive command tool allows inexperienced GIS users (unlike daily ArcGIS users) the ability to simulate the same process in simpler terms, giving them the same benefits of viewing, overlaying, and thus analyzing geographical data. 

Then, I specified a styling option for my Leaflet layer variables calling myStyle() by writing a color() function. Using ColorBrewer, I chose a 4-class purple single hue to assign the gridcode break values (0, 500, 1000, and 1500) with hexadecimal color values. Hexadecimal color values are supported in all browsers, making it a great choice in Web GIS development (Morgan, 2018). I chose this hue because it provided great contrast against both imagery layers (Satellite and Streets).

With the added choropleth symbology on the given water quality sampling data layers, this view of the data facilitates an understanding of the spatial distribution by classifying interpolated values of nitrogen levels at water sampling locations around Bayou Texar. This representation allows the user to focus on geographic areas that may need mitigation for the safety of the environment and its inhabitants. Choropleth mapping allows us to view patterns that would be difficult to decipher in a standard spreadsheet. Here we are combining not only choropleth mapping, but also interactivity where the user can zoom in/out and toggle between different data layers for comparison/contrast. 

My concept map seems to have made more connections this week than last week’s. It is a reflection of how I conceive the relationships of these terms as they relate to choropleth mapping in Leaflet. There are more longer arterial paths looping around to break off into collector roads to tie up the intricacies of inter-connectivity. I used more generic linking phrases to do so (see below).