Skip to content

Add a map-level debug flag for Cesium maps#2808

Merged
robyngit merged 9 commits into
developfrom
feature-2807-cesium-debug
Jul 8, 2026
Merged

Add a map-level debug flag for Cesium maps#2808
robyngit merged 9 commits into
developfrom
feature-2807-cesium-debug

Conversation

@robyngit

Copy link
Copy Markdown
Member

This PR adds a map-level debug as well as a show3DTilesInspector option to Cesium map config.

When debug: true is set, the Cesium widget now:

  • enables Cesium tile coordinate and grid imagery overlays
  • shows the FPS counter
  • hides globe skirts to make tile edges easier to inspect
  • logs loaded/rendered/removed layer details to the console
  • shows a small camera position overlay on the map

When show3DTilesInspector: true is set, the Cesium widget now:

  • renders Cesium's built-in 3D Tiles inspector widget
  • lazy-loads the inspector stylesheet only when the inspector is enabled

This change does not automatically enable layer-specific Cesium debug flags such as 3D Tiles debug properties passed through cesiumOptions.

It also adds a shared Utilities.formatFixedNumber() helper and uses it for the camera overlay formatting.

To test manually:

Debug mode:

  1. Configure a Cesium map with debug: true in its map config.
  2. Open a page that renders that Cesium map.
  3. Confirm the map shows:
    • tile coordinate labels
    • grid imagery overlay
    • FPS counter
    • camera position overlay
  4. Pan, zoom, and rotate the camera and confirm the camera overlay updates as the view changes.
  5. Open the browser console and confirm layer information is logged when the map loads.
  6. Set debug: false or remove the flag and confirm the debug overlays/counter/logging no longer appear.

3D Tiles inspector:

  1. Configure a Cesium map with show3DTilesInspector: true in its map config.
  2. Open a page that renders that Cesium map, ideally with a 3D Tiles layer.
  3. Confirm the 3D Tiles inspector appears in the top-right of the map.
  4. Expand and collapse inspector sections and confirm the widget is styled correctly.
  5. Use the inspector controls and confirm they affect the loaded 3D Tileset as expected.
  6. Disable show3DTilesInspector and confirm the inspector no longer appears.

When enabled, the Cesium widget now shows tile/grid debug imagery,
an FPS counter, a camera position overlay, and layer debug logging.
This also adds a shared fixed-number formatter in Utilities and
coverage for the new config and widget behavior.

Issue #2807
When enabled, the Cesium widget now renders Cesium's built-in
3D Tiles inspector and lazy-loads the inspector stylesheet through
MetacatUI's CSS loader.

Issue #2807

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR adds map-level Cesium debugging controls by introducing a debug flag and a show3DTilesInspector flag on the map configuration model, then wiring those options into CesiumWidgetView to enable built-in Cesium debug overlays and the 3D Tiles inspector (with lazy-loaded inspector CSS).

Changes:

  • Add map config defaults and acceptance for debug and show3DTilesInspector.
  • Enable Cesium debug helpers (FPS, grid/tile coordinates, skirts off, camera overlay, layer logging) and optionally render the 3D Tiles inspector with lazy-loaded CSS.
  • Add a shared Utilities.formatFixedNumber() helper plus unit tests for the new behaviors.

Reviewed changes

Copilot reviewed 8 out of 8 changed files in this pull request and generated 5 comments.

Show a summary per file
File Description
test/js/specs/unit/views/maps/CesiumWidgetView.spec.js Adds unit tests for debug mode and 3D Tiles inspector rendering/cleanup.
test/js/specs/unit/models/maps/Map.spec.js Adds tests for new map config defaults and config acceptance.
test/js/specs/unit/common/Utilities.spec.js Adds tests for the new numeric formatting utility.
src/js/views/maps/CesiumWidgetView.js Implements debug-mode toggles, camera overlay formatting, inspector rendering, and debug logging hooks.
src/js/models/maps/Map.js Documents and adds defaults for the new map-level config flags.
src/js/common/Utilities.js Introduces formatFixedNumber() helper.
src/css/map-view.css Styles the debug overlay, FPS counter container, and inspector container.
src/css/Cesium3DTilesInspector.css Adds a Cesium inspector stylesheet intended to be lazy-loaded for the 3D Tiles inspector.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Comment thread src/js/models/maps/Map.js Outdated
Comment thread src/js/views/maps/CesiumWidgetView.js
Comment thread test/js/specs/unit/views/maps/CesiumWidgetView.spec.js
Comment thread src/css/Cesium3DTilesInspector.css
Comment thread src/css/map-view.css Outdated
@robyngit robyngit linked an issue Jul 8, 2026 that may be closed by this pull request
robyngit and others added 4 commits July 7, 2026 20:19
Issue #2807

Co-authored-by: Copilot Autofix powered by AI <175728472+Copilot@users.noreply.github.com>
Avoid duplicating debug imagery layers and logging if render() is called multiple times in the Cesium Map

Issue #2807

Co-authored-by: Copilot Autofix powered by AI <175728472+Copilot@users.noreply.github.com>
Co-authored-by: Copilot Autofix powered by AI <175728472+Copilot@users.noreply.github.com>
@robyngit

robyngit commented Jul 8, 2026

Copy link
Copy Markdown
Member Author

This feature has been tested by @justinkadi who has been using it extensively in a dev instance of MetacatUI.

@robyngit
robyngit merged commit 936fdb3 into develop Jul 8, 2026
@github-project-automation github-project-automation Bot moved this to Done in MetacatUI Jul 8, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

Status: Done

Development

Successfully merging this pull request may close these issues.

Add Cesium debug mode to map config

3 participants