Skip to content

Deep dive series legend with rowSpan grouping and sticky labels#182

Merged
atheurer merged 2 commits intomasterfrom
deep-dive-legend
Apr 25, 2026
Merged

Deep dive series legend with rowSpan grouping and sticky labels#182
atheurer merged 2 commits intomasterfrom
deep-dive-legend

Conversation

@atheurer
Copy link
Copy Markdown
Contributor

Summary

  • Deep dive legend with live value tracking, click-to-pin, and cross-chart sync
  • rowSpan grouping for breakout segments (hostname spans all CPU rows)
  • Common prefix/suffix stripping from segment values
  • Sticky text in tall rowSpan cells so group labels stay visible while scrolling
  • Color swatches positioned next to value column
  • Disable SVG focus outline on click
  • Apply same sticky label treatment to compare view breakout sidebar

Test plan

  • Deep dive: hover over chart updates values in legend for all charts
  • Deep dive: click to pin, click again to unpin
  • Deep dive: legend groups by hostname with rowSpan, CPU numbers in rows
  • Deep dive: hostname stays visible when scrolling through CPU rows
  • Compare view: breakout sidebar labels stay visible when scrolling

🤖 Generated with Claude Code

Deep dive legend:
- Live value tracking as pointer moves across chart, persists on exit
- Click-to-pin/unpin with cross-chart sync via shared elapsed time
- Reference line on all charts at the active time position
- rowSpan grouping for breakout segments (hostname spans CPU rows)
- Common prefix/suffix stripping from segment values
- Sticky text in tall rowSpan cells so group label stays visible
  while scrolling
- Color swatches positioned next to value column
- Disable SVG focus outline on click

Compare view:
- Apply same sticky label treatment to breakout sidebar rowSpan cells

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Deep dive improvements:
- Unified legend with per-iteration color columns, rowSpan grouping
- Per-metric Combined/Split/Stacked chart mode controls
- Brush-to-zoom with composable re-query
- Sample-index-based data alignment across iterations
- Two-pass filter for resolution > 1 (filter at res=1, re-query survivors)
- Context bar with collapsible Common section and iteration cards
- Auto-pin at 50% elapsed on initial data load
- connectNulls for combined mode charts

Compare view:
- Deep dive iteration selection via clickable boxes on bar chart
- Selected iterations shown as themed cards with remove buttons
- Iteration cards ordered to match bar chart sort order
- Common items styled with color-coded chips (matching search/deep dive)

Unified iteration labels:
- Shared buildIterItems/iterItemsToString in utils/iterLabel.js
- Value consolidation (bs,rw,size=4k) across all views
- Box-in-box iteration cards in search, compare, and deep dive
- Single-column vertical layout for inner chips
- Horizontal scroll for iteration card rows

Search view:
- Collapsible Common section with details/summary
- Selection bar with box-in-box iteration cards and horizontal scroll
- Header row with count and Clear All

Server:
- Cleaned up verbose debug logging (commented out OS-REQ/RESP/BATCH)
- Kept PERF summary and METRIC-DESC timing

Documentation:
- Updated DESIGN.md with deep dive workflow, query performance, zoom
- Updated ARCHITECTURE.md Phase 3 status

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
@atheurer atheurer merged commit fa7cb40 into master Apr 25, 2026
58 of 62 checks passed
@github-project-automation github-project-automation Bot moved this from In Progress to Done in Crucible Tracking Apr 25, 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.

2 participants