1 Introduction

In this module, we will discuss the following concepts:

  1. The GEE objects used in generating a graphical user interface.
  2. How to develop panels with interactive elements.
  3. How to connect geoprocessing elements to interactive elements.

2 Background

Over the past ten modules we have shown that Google Earth Engine can be a significant and efficient resource for visualizing and running analyses with remotely sensed data. Given the range of topics addressed over these modules it is also clear that many different fields of science and management can benefit from the application of remotely sensed data. That said, being comfortable enough to engage with GEE and create your own scientifically sound analysis is something that not everyone will have the time or energy to do. More often than not, project partners are not going to be excited if the final deliverable they receive is simply a bunch of code. In this module we will cover the process of creating a Graphical User Interface (GUI) that will allow a more straightforward, point-and-click experience of the geoprocessing that the code is performing.

2.1 About the Data

For this module, we will be adapting a preexisting project completed by the Colorado NASA DEVELOP program in Summer of 2018. The DEVELOP team created a GUI in GEE that allowed National Park Service employees to observe changes in fluvial and vegetative morphology of flood plains along stretches of the Colorado, Yampa, and Green Rivers in Utah and Colorado. The project used data from Landsat 5, Landsat 7, Landsat 8, and Sentinel 2 to provide a visualization of 32 years of morphological changes within these river systems. The analysis performed within the code is relatively simple because the goal of the project was to provide end users with a resource that was easy to understand and flexible enough to allow them to ask their own questions with the data. In this module we will adapt this work to visualize the changes in vegetation in three major river deltas from around the world. There are many interesting scientific questions that can be asked with the remote sensing of deltas. But this module will focus on the technical explanation of the GUI development more than the details of the scientific methods being presented.



3 Understanding the Graphical User Interface

The Google Earth Engine Code Editor is a graphical user interface on its own. While we cannot alter the base elements (map, task pane, etc.), we can add to their functionality. Depending on the need, one can add three different classes of elements (widgets, panels, and events) to the existing GUI. These three class elements are interconnected. To learn a bit more about each element we will use an example where we ask a simple question about the capabilities of a Landsat image.

Using NDVI derived from Landsat can we effectively distinguish the “A” on the hogback just west of Fort Collins from the surrounding vegetation in the summer?*


We will begin with simplified examples to provide a conceptual understanding of how the elements of GUI development work in GEE. Once we cover these elements we will move on to a more complex presentation of this material by reproducing the River Morphology Evaluation Toolbox (RMET) code to map the vegetation change of river deltas across the Landsat 5-8 collection timeframe (1984 to present).

3.1 Widgets

Widgets are the base level functions for adding interactivity to your code. There are many widgets available to choose from. Before continuing this module, we highly suggest visiting the documentation for widgets and running through all the presented examples by copying and pasting the code examples into a GEE script.

To demonstrate a widget, we are going to generate a histogram of values from the region surrounding the “A” in the image below to see if there is a bimodal pattern to the distribution due to the white color of the “A”.