feat(ui): add prediction chart rendering with histogram overlay, markers, filtering, and visibility toggle

- Add histogram series to CandleChart for per-bar prediction colors (15% opacity)
- Add series markers showing label name and confidence % at prediction span starts
- Implement confidence threshold filtering for both histogram and markers
- Implement label type filtering from PredictionPanel checkboxes
- Implement prediction layer visibility toggle (show/hide)
- Add getVisibleCandles method to CandleChartHandle for on-demand prediction fetching
- Pass prediction state props from page.tsx to CandleChart

Tasks 10.1-10.5 complete.
This commit is contained in:
Marko Djordjevic 2026-02-15 16:26:17 +01:00
parent 28ebe2c5d1
commit 952eb7413c
4 changed files with 138 additions and 8 deletions

View file

@ -573,6 +573,12 @@ export default function Home() {
selectedSpanId={selectedSpanId}
onSpanAnnotationsChange={handleSpanAnnotationsChange}
onSelectedSpanChange={handleSelectedSpanChange}
predictionVisible={predictionState.visible}
perCandlePredictions={predictionState.perCandlePredictions}
predictionSpans={predictionState.spans}
confidenceThreshold={predictionState.confidenceThreshold}
selectedLabels={predictionState.selectedLabels}
modelInfo={predictionState.modelInfo}
/>
</main>
</div>