Guides
Value overlay
Large live number via DOM, not React re-renders
showValue
<LiveChart
data={data}
value={value}
showValue
valueMomentumColor
formatValue={(v) => v.toFixed(2)}
badge={false}
style={{ height: "100%" }}
/>| Prop | Default | Role |
|---|---|---|
showValue | false | Large centered (or layout-aware) live number |
valueMomentumColor | false | Tint the number with momentum green/red |
formatValue | v.toFixed(2) | Shared with badge & tooltips |
60fps value overlay with momentum colouring.
Updates run at frame rate through a DOM node owned by the engine — toggling showValue does not force React to re-render every frame.
Layout tips
- Leave vertical room if you also show
windowsor mode toggles (style/ padding). - Often disable
badgewhen the overlay is the primary readout. - Pair with
themeso contrast holds on light and dark surfaces.