From Satellite Data to Interactive Globe in Minutes: How Hermes Agent Builds Real NASA GIBS Viewers

Public Earth observation data is one of the most underutilized resources on the internet. NASA alone generates terabytes of satellite imagery every day—MODIS true-color composites, VIIRS nighttime lights, NDVI vegetation indices, aerosol optical depth, land surface temperatures, sea ice concentration—and makes it freely available through the Global Imagery Browse Services (GIBS) program. The data is there. The challenge has always been the gap between "available" and "usable."

Here is what "usable" looks like: a live, interactive 3D globe with 24 NASA satellite layers, a time-aware date picker, an opacity slider, and a categorized layer switcher. Try it right here in the page, or open the full-screen version:

This is not a mockup. It is a single HTML file that loads CesiumJS, pulls tiles from NASA GIBS in real time, and lets you switch between atmosphere, land surface, cryosphere, ocean, hazard, and human-dimensions layers with a click. The base layer is OpenStreetMap (with an optional CartoDB Dark Matter toggle). No build step, no API key for NASA data, no server required.

Building something like this by hand is surprisingly difficult. I know because I built a simplistic globe viewer in the early 2000s with no zoom in tiles or dates, just a static NEO png image draped on a globe. It took more than a week. Building it with Hermes Agent is just a conversation and a few minutes.


The Problem: GIBS Is Powerful but Pedantic

GIBS is a WMTS (Web Map Tile Service) endpoint. If that acronym makes you reach for documentation, you already understand the problem. To display a single satellite layer in a web browser, you need to know:

Get any of those wrong and you get a blank map or a wall of 404s. The NASA GIBS catalog contains hundreds of layers, each with its own rules. The documentation is thorough but scattered across GetCapabilities XML, GitHub repos, and deprecation notices.

For the demo above, here is a sample of what you need to get right just for the Atmosphere category:

LayerExact IDTileMatrixSetFormatMax Zoom
MODIS Terra AerosolMODIS_Terra_Aerosol_Optical_Depth_3kmGoogleMapsCompatible_Level6png6
OMI Nitrogen DioxideOMI_Nitrogen_Dioxide_Tropo_ColumnGoogleMapsCompatible_Level6png6
GPM IMERG PrecipitationIMERG_Precipitation_RateGoogleMapsCompatible_Level6png6

Notice the pattern: the layer IDs are not guessable. MODIS_Terra_Aerosol returns 404; the correct ID is MODIS_Terra_Aerosol_Optical_Depth_3km. The TileMatrixSet is Level6, not Level9. The format is png, not jpg. Multiply this by 24 layers across six categories, and the metadata catalog alone is a project.


What Hermes Agent Does Differently

Hermes Agent does not just generate code. It validates against live services before presenting results to you. When working with NASA GIBS, this means:

The result is that a user can say "show me MODIS true color from yesterday on a 3D globe with a layer switcher" and get back a verified, interactive viewer—not a tutorial on WMTS specs.


Real-World Build: The Cesium + GIBS Demo

The demo at the top of this post was built through that exact workflow. Here is what it took.

Step 1: Cataloging 24 Verified Layers

The user asked: "I want a 3D globe with NASA satellite layers grouped by category—atmosphere, land, ice, ocean, hazards, and human activity."

Hermes queried the GIBS catalog, parsed GetCapabilities, and validated each candidate with live HTTP requests. The result was a curated set of 24 layers with exact metadata:

1. Atmosphere Layers

2. Land Surface Layers

3. Cryosphere & Ice

4. Ocean & Hydrosphere

5. Near Real-Time Hazards

6. Human Dimensions

Each layer was validated with a live curl -I request against gibs.earthdata.nasa.gov before being included. Each has a known-good default date (some datasets lag by days, others by years—Landsat WELD, for example, is monthly and stops at 2001).

Step 2: URL Construction

For a daily-updating layer like MODIS True Color, the tile URL pattern is:

https://gibs.earthdata.nasa.gov/wmts/epsg3857/best/
  MODIS_Terra_CorrectedReflectance_TrueColor
  /default/2026-06-01/GoogleMapsCompatible_Level9/{z}/{y}/{x}.jpg

The /default/{date}/ segment is the time parameter. For 8-day composites like NDVI, the date resolves to the start of the current 8-day window. For static layers like VIIRS Black Marble, the time segment is omitted entirely.

The demo builds these URLs dynamically in JavaScript:

const urlTemplate =
  `https://gibs.earthdata.nasa.gov/wmts/epsg3857/best/` +
  `${cfg.layer}/default/${date}/${cfg.tileMatrixSetID}/{z}/{y}/{x}.${ext}`;

When you pick a new date from the calendar, the overlay refreshes with the new URL. When you switch layers, the TileMatrixSet, format, and max zoom all update automatically.

Step 3: CesiumJS + OpenStreetMap Integration

The demo uses CesiumJS (no Ion token required) with an OpenStreetMap base layer:

baseLayer = viewer.imageryLayers.addImageryProvider(
  new Cesium.UrlTemplateImageryProvider({
    url: 'https://a.tile.openstreetmap.org/{z}/{x}/{y}.png',
    minimumLevel: 0,
    maximumLevel: 19,
    credit: new Cesium.Credit("OpenStreetMap contributors")
  })
);
viewer.imageryLayers.lowerToBottom(baseLayer);

A toggle switches to CartoDB Dark Matter for a darker base that makes bright GIBS overlays pop. The GIBS overlay is added on top, with its alpha controlled by the opacity slider. The result is satellite data draped over a familiar street map, with full camera control—zoom, rotate, tilt, fly to any location.

Step 4: UI That Scales

Twenty-four layers is too many for a flat list. The demo uses collapsible <details> elements grouped by category:

Each button is a single HTML element with data-layer attributes. The JavaScript wires them up in a few lines. The opacity slider and date picker are standard DOM inputs with event listeners. No React, no build step, no dependencies beyond CesiumJS itself.


The Pitfalls Hermes Caught

Working with GIBS manually is error-prone. Here are real mistakes that Hermes prevented during this build:


Beyond a Single Viewer

The real value is not one map. It is the pattern.

NASA GIBS is just one of many Earth observation data sources, but it is among the richest and most accessible. The catalog spans atmosphere, land, ocean, ice, and human activity—hundreds of layers, decades of coverage, global scope. The traditional workflow for tapping into it is: read docs, write code, debug 404s, read more docs, repeat.

Hermes Agent collapses that loop. It has a persistent skill for GIBS with a validated layer catalog, correct URL patterns, known pitfalls, and working templates. When a user says "show me sea surface temperature for the Gulf of Mexico," Hermes does not start from zero. It loads the GIBS skill, identifies the correct GHRSST MUR SST layer, validates the endpoint, and renders it on a globe in the same conversational interaction.

This is what "AI-native data visualization" looks like: the agent owns the integration complexity, the user owns the question.


Try It Yourself

If you have Hermes Agent, the entire GIBS layer catalog is one prompt away:

"Show me a CesiumJS globe with MODIS true color and a layer switcher for NDVI, aerosol, and nighttime lights. Use OpenStreetMap as the base layer. Make it time-aware so I can pick any date in the last 30 days."

Hermes will discover the layers, validate the endpoints, construct the URLs, build the HTML, and—if you want—deploy it to a public URL you can share. No WMTS manual required.

NASA has already done the hard part: launching satellites, processing imagery, and making it free. Hermes Agent does the rest: turning that raw public data into something you can see, explore, and share in minutes.