Version: 1.0.0

Panes

The pane structure (or multi-panel chart layout) allows displaying secondary technical indicators (such as RSI, MACD, or Stochastics) inside vertically stacked sub-panels below the main candlestick chart.

Dynamic Height Split Layout

At the core of the multi-panel layout, Backtestx Charts segments the canvas vertically. While overlay indicators (like SMAs or Bollinger Bands) render directly on the main chart, separate panel indicators occupy dedicated sub-panes:

SUB_PANEL_H = 80px // Height constant per indicator pane
totalPanelsH = numPanels * SUB_PANEL_H
chartH = logicalHeight - paddingBottom - totalPanelsH

The main viewport height chartH adjusts automatically as the developer adds or removes pane-type indicators, guaranteeing that the charts never overflow the canvas boundaries.

Pane Indicators vs Overlays

Backtestx Charts classifies technical indicators into two categories based on their registry configuration:

Overlay Indicators

Shared coordinate scale indicators (e.g. sma, ema, bb, vwap). They are drawn directly inside the main candlestick chart viewport utilizing the primary Y-axis price scaling bounds.

Pane Indicators

Independent vertical axis indicators (e.g. rsi, macd, stoch). They are drawn inside a separate sub-panel below the main chart using a private scaled coordinate mapper.

Local Auto-Scaling

Because sub-pane indicators output values on different scales (e.g. RSI is bounded 0–100, MACD fluctuates around zero), each pane computes its vertical boundaries independently in the rendering loop:

Visible Index Sweep: Scans indicator dataset arrays starting at startIndex and ending at endIndex to track minimum and maximum visible values.
Scale Margins: Pads the raw range by 5% at the top and bottom to prevent indicator line paths from clipping into panel border lines.
Coordinate Mapping Formula: Transforms values to vertical canvas pixel coordinates:
toY(val) = panelY + SUB_PANEL_H - ((val - minVal) / (maxVal - minVal)) * SUB_PANEL_H

Legends & Snap Hover

Each pane displays dynamic descriptions in its top-left corner, acting as a real-time status overlay:

Status Ticker Legends: Renders indicator naming and active parameter configurations (e.g., RSI (14)).
Snapped Value Arrays: As the user hovers across slots, the legends immediately update to show formatting arrays for that specific bar index. When the crosshair leaves the viewport, values default back to the latest dataset indices.

Levels & Ticks

For indicators that require standard reference thresholds (such as RSI oversold/overbought levels), sub-panes support horizontal scale levels:

Scale Grid Ticks: Ticks are drawn as dashed lines across the pane viewport at defined numeric levels (e.g., 30.00 and 70.00 for RSI).
Y-Axis Value Labels: The numeric value tags are printed on the right vertical axis divider, matching the theme colors of the main chart Y-axis ticks.

Crosshair Synchronization

Mouse movements synchronize crosshairs dynamically across the entire vertical stack:

Unified Vertical Alignment: The vertical crosshair line snaps to the hovered bar index and extends top-to-bottom across all active panes, aligning candlestick data directly with indicator data.
Localized Horizontal Tracking: The horizontal crosshair cursor line and its corresponding Y-axis coordinate badge only render inside the specific pane currently containing the mouse cursor.