DebugLayersStack<T> class

Stack of graph-coordinate debug visualization layers.

This widget composes debug layers that are rendered in graph coordinates (inside the InteractiveViewer's transformed space). For screen-coordinate overlays like autopan zones, use AutopanZoneDebugLayer directly outside the InteractiveViewer.

Coordinate Systems

NodeFlow uses two coordinate systems for debug layers:

1. Graph coordinates (this widget): Layers that zoom/pan with the canvas

   • Spatial index grid
   • Node bounds visualization
   • Connection routing debug

2. Screen coordinates (separate widgets): Layers fixed to viewport

   • AutopanZoneDebugLayer: Edge padding zones
   • Minimap overlay

Included Layers

When config.debugMode is true:

• SpatialIndexDebugLayer: Shows the spatial index grid partitioning

Usage

// Inside InteractiveViewer's child (graph coordinates)
DebugLayersStack<MyData>(
  controller: controller,
  transformationController: transformationController,
  theme: theme,
)

// Outside InteractiveViewer (screen coordinates)
AutopanZoneDebugLayer<MyData>(controller: controller)