Earth Engine Studio guide
Maps & geometries
Display and inspect Earth Engine layers, choose map providers and basemaps, and maintain editable geometry workspaces.
Work with the main map
The main Map responds to the familiar Studio Map global. Add Earth Engine
images or vectors, change the viewport, and register supported events from
JavaScript or Python. Its last center, zoom, bearing, and pitch are remembered
in the browser.
When no remembered view exists, Studio can request an optional low-accuracy browser location. If that is unavailable or disabled, the map starts with a Europe-wide overview.
var cities = ee.FeatureCollection("FAO/GAUL/2015/level1")
.filter(ee.Filter.eq("ADM0_NAME", "Austria"));
Map.centerObject(cities, 6);
Map.addLayer(cities.style({color: "72f1b8", fillColor: "17324d55"}), {}, "Regions");
Choose a renderer and basemap
Studio keeps a provider-neutral map boundary:
- MapLibre is the default and supports the full Studio display extension surface, including compute-pixel and vector-field layers.
- OpenLayers is a GIS-oriented alternative for ordinary Earth Engine display and inspection workflows.
- Google Maps is optional and appears only when the Studio deployment has a configured Google Maps key.
Set the default main-map renderer in Settings. A script-created map may
select its own provider with Map.create({provider: "openlayers"}); omission
uses MapLibre regardless of the current main-map preference.
OpenStreetMap is the standard basemap. The toolbar and Map.setOptions(...)
also expose attributed Sentinel-2 Cloudless imagery and NASA Blue or Black
Marble mosaics. External tile services retain their own licenses, usage limits,
and availability conditions.
Manage layers
Each layer row can change visibility and opacity. Compatible Earth Engine image layers request normal XYZ tiles by default.
MapLibre can instead use browser-rendered computePixels tiles. The Pixels /
tile choice of 64 × 64, 128 × 128, or 256 × 256 controls the amount of
computed output per geographic tile. Lower values reduce detail and memory;
they do not change the geographic tile grid.
MapLibre and WebGL2 can also apply a custom fragment-shader expression to a
compute-pixel layer. Set shader to one GLSL expression that returns
vec4(red, green, blue, alpha). The expression can read values, normalized,
uv, mercator, and alpha; Studio rejects declarations, statements,
preprocessor directives, and direct gl_* access. Earth Engine still computes
the input pixels, so normal authentication, band-selection, and compute-pixel
limits continue to apply.
const temperature = ee.Image.pixelLonLat()
.select("latitude")
.rename("temperature");
Map.addLayer(temperature, {
bands: ["temperature"],
min: -90,
max: 90,
tileSize: 128,
shader: "vec4(normalized.r, smoothstep(0.15, 0.8, normalized.r), 1.0 - normalized.r, alpha)"
}, "Temperature shader");
Two-band compute-pixel layers can render vector fields as animated particles or
arrows. Layer settings control interpolation, density, speed, trails, placement,
palette, and magnitude scaling. Reduced-motion users begin with a paused arrow
view. In globe view, arrows and particles are culled at the horizon. Set
arrowDistribution: "uniform" (or "equal-area") to use equal-area Fibonacci
anchors instead of the Mercator grid and avoid excess arrows near the poles.
Anchor density scales with zoom and changes to screen spacing at close range so
the visible density remains stable through MapLibre’s globe-to-Mercator
transition. arrowSpacing remains the density control; layer settings expose
the same option as Uniform globe.
Render client-side point symbols
Set renderer: "symbols" to opt a Point or MultiPoint collection into
MapLibre’s WebGL symbol renderer. The input can be an authenticated
ee.FeatureCollection or a local GeoJSON FeatureCollection; local data does
not require Earth Engine sign-in.
Map.addLayer(peaks, {
renderer: "symbols",
symbol: {
type: "mountain", typeProperty: "symbol_type",
size: 18, sizeProperty: "size",
color: "#5b4636", colorProperty: "symbol_color"
},
label: {
property: "label",
position: "above", positionProperty: "label_position",
fontFamily: "serif",
fontSize: 14, fontSizeProperty: "font_size",
scale: "zoom",
color: "#2c2118", colorProperty: "text_color",
effect: {type: "outline", color: "#f5ead3", width: 2}
},
idProperty: "system:index",
minZoom: 4, maxZoom: 18,
featureMinZoomProperty: "min_zoom",
featureMaxZoomProperty: "max_zoom",
allowOverlap: false
}, "Historic peaks");
Symbols may be circle, mountain, or none. Labels can be above, below,
left, right, or center; explicit \n characters create multiple lines.
Numeric marker sizes are screen pixels clamped to 1–128. Font sizes default to
14 and clamp to 8–64. With scale: "zoom", text scales from 0.75× at zoom 0,
through 1× at zoom 12, to 1.5× at zoom 24; "fixed" retains its pixel size.
Missing or invalid property overrides fall back to the layer value. A missing
feature min/max zoom property leaves the feature visible.
Symbols and text are viewport-aligned: labels remain upright and mountain
bases horizontal under bearing and pitch. Collisions are avoided by default,
with the closest foreground symbol placed first. allowOverlap: true disables
that protection. Text effects support halo, outline, and a matching
non-blocking shadow underlay. The v1 font aliases are sans, serif, and
monospace. MapLibre generates glyphs in the browser from the corresponding
installed CSS generic family, so exact shapes, metrics, and character coverage
depend on the client.
Earth Engine data is fetched for visible wrapped XYZ tiles plus a one-tile margin, then deduplicated into one GeoJSON source so labels may cross query-tile boundaries without seams. Requests paginate by 1,000 features, run four at a time, cache 128 tiles per layer, cancel stale viewport work, and stop at 5,000 features per query tile with a warning. Filter dense collections before display. Non-point geometries are skipped with a layer warning.
Rich symbols are MapLibre-only in v1. OpenLayers and Google Maps skip the layer and show a provider warning. For an empty layer, check the selected provider, point geometry, label and zoom properties, Earth Engine sign-in, and truncation warnings.
Build Earth Engine UI Apps
Legacy Earth Engine ui scripts run directly in Studio. Printing an unattached
widget, such as print(ui.Button("Inspect")), renders it live in Console.
Mutating ui.root, including ui.root.clear(), or attaching a widget to a
ui.Map opens a dedicated App tab beside the main Map without replacing
the Studio workspace map.
Maps created inside an App remain embedded unless the script explicitly calls
map.open(). ui.SplitPanel supports horizontal, vertical, and wipe layouts;
Studio also accepts an optional diagonal wipe angle or
splitPanel.setAngle(degrees). ui.Map.Linker([left, right]) synchronizes App
map bounds, while change-center and change-zoom can link only part of the
viewport. Embedded maps fill their split panes and support the six original map
control groups through Map.setControlVisibility(...).
Apps can set a header and isolated styling without changing Studio itself:
ui.App.setHeader({title: "Coast viewer", subtitle: "Interactive analysis"});
ui.App.setCss(".primary-action { background: #137333; color: white; }");
ui.root.clear();
ui.root.add(ui.Button({label: "Run", className: "primary-action"}));
The App preview toolbar can download injected CSS for a future standalone deployment. App tabs belong to the current session and are recreated when their script runs again.
Add categorical legends
ui.Legend is a Studio extension for classified images. Supply aligned
values, names, and palette arrays to create a legend without an Earth
Engine metadata request. An optional descriptions array adds a tooltip to
each class color and name:
var legend = ui.Legend({
title: "Land cover",
values: [1, 2],
names: ["Forest", "Water"],
palette: ["00A600", "00CCF2"],
descriptions: ["Tree-covered land", "Permanent inland water"]
});
Map.add(legend);
The widget can also discover class metadata from an ee.Image or homogeneous
ee.ImageCollection. Give it the image property prefix through
description. Collections use first(), so every image is assumed to expose
the same classes:
var corine = ee.ImageCollection("COPERNICUS/CORINE/V20/100m");
Map.add(ui.Legend({
collection: corine,
description: "landcover",
title: "CORINE land cover",
style: {position: "bottom-left", width: "390px"}
}));
For description: "landcover", lookup first tries
landcover_class_values, landcover_class_names, and
landcover_class_palette, then the shorter landcover_values,
landcover_names, and landcover_palette form. Omitting description
searches for a complete matching triplet. While server metadata resolves, the
legend shows a loading state; missing or unequal arrays produce a visible
error instead of a partially aligned legend.
The CORINE catalog contains 44 homogeneous land-cover classes with the standard metadata triplet. See Google’s CORINE dataset page for the authoritative class table.
Inspect a location
Select Inspector, then click the map. Studio samples every visible, compatible Earth Engine image layer at the normalized click coordinate. Coordinates and per-layer results appear together; a failed or unsupported layer reports its own state without preventing other samples.
Inspection is intended for interactive understanding, not bulk extraction. Use a reducer or export when you need repeatable values across many locations.
Draw and edit geometries
Each JavaScript document can own a companion .geojsonl workspace. It stores
named Geometry, Feature, or FeatureCollection records plus Studio color,
visibility, and stable layer metadata.
One visible geometry layer is active for drawing and editing. Other visible layers remain locked, preventing an edit from landing in the wrong record. Points, lines, polygons, polygon holes, and supported multi-geometries are preserved. GeometryCollections and shapes that cannot be edited safely remain read-only.
Use the map drawing toolbar to create or select a layer, then draw, reshape, or
delete features. Saving a remote script commits its companion geometry file
and adds a static loadGeoJSON(...) call when needed.
Repository .geojson and .geojsonl files can also be attached without
becoming the document’s editable companion. See the editor guide
for loading and unpacking rules.
For Earth Engine geometry operations themselves, see Google’s geometry guide.