ScaleSmoothingConfig

Controls animated y-scale transitions as the visible data range changes.

Use it when a chart feels too jumpy while panning or zooming through changing price ranges.

Examples

<Chart data={data} scaleSmoothing />

<Chart
  data={data}
  scaleSmoothing={{
    durationMs: 240,
    expandImmediate: true,
  }}
/>

Disable smoothing explicitly:

<Chart data={data} scaleSmoothing={false} />

Properties

enabled

• Type: boolean
• Default: false

Enables or disables scale smoothing when an object config is provided. Passing scaleSmoothing={true} enables smoothing with the defaults.

durationMs

• Type: number
• Default: 160

Animation duration in milliseconds.

expandImmediate

• Type: boolean
• Default: true

When true, the scale expands immediately to include newly visible values, but contracts smoothly. This helps avoid clipping sudden highs or lows.

TypeScript

interface ScaleSmoothingConfig {
  enabled?: boolean;
  durationMs?: number;
  expandImmediate?: boolean;
}

type ScaleSmoothingInput = boolean | ScaleSmoothingConfig;