Earth Engine Code Editor

The Earth Engine (EE) Code Editor at code.earthengine.google.com is a web-based IDE for the Earth Engine JavaScript API. Code Editor features are designed to make developing complex geospatial workflows fast and easy. The Code Editor has the following elements (illustrated in Figure 1):

  • JavaScript code editor
  • Map display for visualizing geospatial datasets
  • API reference documentation (Docs tab)
  • Git-based script manager (Scripts tab)
  • Console output (Console tab)
  • Task manager (Tasks tab) to handle long-running queries
  • Interactive map query (Inspector tab)
  • Search of the data archive or saved scripts
  • Geometry drawing tools


playground
Figure 1. Diagram of components of the Earth Engine Code Editor at code.earthengine.google.com

The Code Editor has a variety of features to help you take advantage of the Earth Engine API. View example scripts or save your own scripts on the Scripts tab. Query objects placed on the map with the Inspector tab. Display and chart numeric results using the Google Visualization API. Share a unique URL to your script with collaborators and friends with the Get Link button. Scripts you develop in the Code Editor are sent to Google for processing and the generated map tiles and/or messages are sent back for display in the Map and/or Console tab. All you need to run the Code Editor is a web browser (use Google Chrome for best results) and an internet connection. The following sections describe elements of the Earth Engine Code Editor in more detail.

JavaScript editor

The JavaScript editor will:

  • Format and highlight code as you type
  • Underline code with problems, offer fixes and other hints for correct syntax
  • Autocomplete pairs of quotes, brackets and parentheses
  • Offer code completion hints for Earth Engine functions

Above the code editor are buttons for running the script, saving the script, resetting the output map and console, and getting a link to the script. When the Get Link button is pressed, a unique link will appear in the browser’s address bar. This link represents the code in the editor at the time the button was pressed.

API reference (Docs tab)

On the left side of the Code Editor is the Docs tab, which contains the complete JavaScript API documentation. The documentation can be searched and browsed from the Docs tab.

Script manager (Scripts tab)

The Scripts tab is next to the API Docs in the left panel of the Code Editor. The Scripts manager stores private, shared and example scripts. To manage the scripts you create, Earth Engine hosts a private Git repository which is accessible through the Code Editor as well as through Git. Using the script manager, you can rename your scripts and organize them into folders using drag and drop (Figure 2).

scripts
Figure 2. The script manager.

All scripts maintain full version history. Click on the history icon next to a script to compare or revert it to an older version. Rename the script with the edit icon and delete it with the delete icon. The default repository is private, but you can create additional, shared repositories and configure access using the settings icon. Repositories can be accessed using Git, so you can manage and edit your scripts outside the Playground, or sync them with an external system like GitHub. Click on the icon next to your private repository for instructions. (Learn more about Git from this tutorial). Search through your scripts using the filter bar at the top of the tab. In the Examples section of the script manager, there is a set of Google-provided and maintained sample scripts.

Asset Manager (Assets tab)

The Asset Manager is in the Assets tab in the left panel. Use the Asset Manager (Figure 3) to upload and manage your own image assets in Earth Engine. See the Asset Manager page for details.

assets
Figure 3. The asset manager.

Search tool

To find datasets to use in your scripts, you can use the search tool for the data archive. The search tool is the text box at the top of the Code Editor that says 'Search places and datasets...' Type the name of a data product, sensor, or other keyword into the search bar and click the search button to see a list of matching places, raster and table datasets. Click on any raster or table result to see the description for that dataset in the archive. To import the dataset directly into your script, click the import link or the button from the dataset description.

Imports

The results of importing datasets to your script are organized in an imports section at the top of your script, hidden until you import something. Once you have created some imports, you should see something similar to Figure 4. To copy imports to another script, or convert the imports to JavaScript, click the subject icon next to the Imports header and copy the generated code into your script. You can delete the import with the delete icon.

imports
Figure 4. The imports section at the top of the code editor.

Map

The Map object in the API refers to the map display in the Code Editor. For example, Map.bounds() will return the geographic region visible in the Code Editor. Check the Map functions in the API to see other customizations for this display.

Layer Manager

Use the layer manager in the upper right corner of the map to adjust the display of layers you added to the map. Specifically, you can toggle the visibility of a layer or adjust its transparency with the slider. Click the settings icon to adjust visualization parameters for individual layers. The visualization tool that appears (Figure 5) allows you to interactively configure layer display parameters. Click the button on the right of the tool (which performs a Custom stretch to the supplied min and max range by default) to linearly stretch the display to either percentiles or standard deviations of image values in the display window. Statistics are computed from all the pixels in the Map window at the current zoom level. Use the sliders to adjust gamma and/or transparency. Click the Palette radio button and specify a custom palette by adding colors (add), removing colors (remove) or manually entering a comma separated list of hex strings (edit). Click Apply to apply the visualization parameters to the current display. Click Import to load a visualization parameters object as a new variable in the imports section of your script.

imports
Figure 5. The layer visualization tool.

Note that to the right of the layer manager are toggle buttons for different map backgrounds. Customize the background using Map.setStyle().

Inspector tab

The Inspector tab next to the tasks manager lets you interactively query the map. When the Inspector tab is activated, the cursor becomes a crosshair which will display the location and layer values under the cursor when you click on the map. For example, Figure 6 shows the results of clicking on the map with in the Inspector tab. The cursor location and zoom level are displayed along with pixel values and a list of objects on the map. The objects list is interactive. To see more information, expand the objects in the Inspector tab.

inspector
Figure 6. The Inspector tab shows information about the cursor location and the layer values under the cursor.

Console Tab

When you print() something from your script, such as text, objects or charts, the result will be displayed in the Console. The console is interactive, so you can expand printed objects to get more details about them.

Tasks tab

For long running tasks, use the Export object to perform large computations that result in an Image or FeatureCollection. Manage the exported tasks on the Exports tab. To start the export, click the run button next to the exported task in the Tasks tab. A configuration dialog will appear that allows you to choose the resolution or size for images, and the format (CSV, GeoJSON, KML or KMZ) for tables. Once you have run the task, hovering over the task in the task manager will show a ‘?’ icon which you can use to check the task status. To cancel a task, click on the spinning icon next to the task to cancel it.

Profiler

The profiler displays information about the resources (CPU time, memory) consumed by specific algorithms and other parts of a computation. This helps to diagnose why a script is running slowly or failing due to memory limits. To use the profiler, click the settings icon at the top of the code editor, then select Enable performance profiling. This activates a Profiler tab on the right side of the code editor. When you run your script, the Profiler tab will display a table of resource usage from the script.

The profiler displays information about CPU and memory usage (per algorithm and asset) resulting from computations invoked by the script and the display of every tile currently visible in the map. Each row in the profiler output corresponds to an algorithm, computation, asset load or overhead operation as described in the 'Description' column. The columns in the profiler are:

Description
A textual description of the computation, algorithm, asset load or overhead operation being profiled.
Count
An indicator proportional to the number of times the operation described in 'Description' was invoked.
Compute
An indicator of CPU time taken by the operation(s).
Current Mem
This column appears only if there was an error because the script used too much memory. It shows the amount of memory in use on any single compute node at the moment the error occurred.
Peak Mem
Maximum memory used on any single compute node for the operation.

Geometry tools

You can also import geometries to your script by drawing them on screen. To create geometries, use the geometry drawing tools in the upper left corner of the map display (Figure 7). For drawing points, use the placemark icon , for drawing lines, use the line icon , for drawing polygons, use the polygon icon . Using any of the drawing tools will automatically create a new geometry layer and add an import for that layer to the Imports section. To add geometries to a new layer, hover on the Geometry Imports in the map display and click the +new layer link. You can also toggle visibility of the geometries from the Geometry Imports section. Note that drawn geometries are geodesic by default. Use the Geometry constructor to convert them to planar geometries. Learn more about geometries in Earth Engine on the Geometry page.

geometries
Figure 7. The geometry drawing tools are in the upper left corner of the map display.

To configure the way geometries are imported to your script, click the settings icon next to the layer in the Geometry Imports section on the map or in the Imports section of the code editor. The geometry layer settings tool will be displayed in a dialog box which should look something like Figure 8. Note that you can import the drawn shapes as geometries, features or feature collections. The geometry import settings also allow you to change the color with which the layer is displayed, add properties to the layer (if it is imported as a Feature or FeatureCollection) or rename the layer.

geometry_import
Figure 8. The geometry configuration tool.

Help!

Click the Help button to see links to this Developer's Guide, the help forum, a guided tour of the Code Editor and a list of keyboard shortcuts that help with coding, running code, and displaying data on the Map.

Send feedback about...

Google Earth Engine API