Skip to main content

Cesium Viewer Architecture

The built-in Cesium routes share one frontend structure instead of embedding large inline scripts in each HTML template.

Route and Template Split

  • routers/cesium.py prepares a VIEWER_CONFIG JSON payload for each page.
  • templates/cesium_hello.html, templates/cesium_ion.html, templates/cesium_wms.html, and templates/cesium_terrain_test.html are thin shells that mount Cesium and load external assets.
  • Browser modules are served from /cesium/assets.

This keeps route-time values on the server side and viewer behavior in static modules that can be reused across pages.

Shared Modules

Use these first when adding or extending a Cesium page:

  • templates/assets/js/cesium-shared.js: JSON config loading, token setup, default viewer creation, status helpers, and bbox navigation.
  • templates/assets/js/cesium-basic-viewer.js: bootstrap for /cesium/hello, /cesium/ion, and /cesium/wms.
  • templates/assets/css/cesium-basic-viewer.css: shared styling for the simple Cesium pages.
  • templates/assets/js/cesium-viewer/layers.js: shared WMS and WFS loading helpers.
  • templates/assets/js/cesium-viewer/panels.js: shared controls for layers, footprints, feature inspection, and draw tools.
  • templates/assets/js/cesium-viewer/interactions.js: shared click and interaction wiring for richer viewers.

Terrain-Specific Modules

The terrain validation page builds on the shared modules with a small terrain-specific layer:

  • templates/assets/js/cesium-terrain-test/terrain-bootstrap.js: main coordinator for /cesium/terrain-test.
  • templates/assets/js/cesium-terrain-test/dataset-query.js: dataset-backed point and batch query client.
  • templates/assets/js/cesium-terrain-test/terrain-query-interactions.js: terrain-specific raster and feature inspection flow.
  • templates/assets/js/cesium-terrain-test/config.js, map.js, and feature-info.js: terrain route helpers that stay local to the richer viewer path.

Extension Pattern

When adding a new page:

  1. Add a route in routers/cesium.py that emits a minimal VIEWER_CONFIG payload.
  2. Keep the HTML template thin and load one entry module.
  3. Reuse cesium-basic-viewer.js if the page only needs simple bootstrap behavior.
  4. Reuse modules in templates/assets/js/cesium-viewer/ before creating new route-specific logic.
  5. Add a dedicated module only for behavior that is truly page-specific.

Current Pages

RouteEntry moduleNotes
/cesium/hellotemplates/assets/js/cesium-basic-viewer.jsminimal smoke page
/cesium/iontemplates/assets/js/cesium-basic-viewer.jstoken and Ion validation
/cesium/wmstemplates/assets/js/cesium-basic-viewer.jsWMS overlay example
/cesium/terrain-testtemplates/assets/js/cesium-terrain-test.jsricher terrain and query workflow

Use this page as the reference point for future Cesium viewer refactors so shared behavior stays shared and route-specific behavior stays small.