Toolkit

ChartToolbar, ChartReadout, ChartOverview and Legend are optional normal-flow siblings. ChartReadout adds a compact text summary on wide plots. The plot owns keyboard observation input and visible inspection marks even when no tooltip is configured. Add Tooltip for a floating fine-pointer view. Click to pin an observation; Compare from here turns that pin into a baseline. Drag to compare, then drag or step either endpoint to refine it. Click the interval to focus, and use Full range to return while retaining the answer. Escape cancels an edit, then leaves focus, then clears the comparison or pin.

Comparison content is opt-in. useChartComparison() exposes the selected range, every visible series’ endpoint values and differences, and clear/focus actions for your own header, footer or other JSX. compare.onChange exposes the same data outside the chart. To place it in a tooltip, supply Tooltip.renderComparison. The library calculates the difference; the comparison JSX belongs to the consumer.

On a model, actions.compare({ startX, endX }) establishes the same range without a toolbar. Its result includes typed original endpoint rows, every visible measure, signed change, percentage policy and unavailable reasons. The optional tooltip can render that result; a legend or ordinary page heading can render it too.