Mobile Gestures

ApexCharts 6.0 ships native-feeling touch gestures under the Momentum set: two-finger pinch-zoom around the centroid, two-finger pan, and kinetic inertia after a one-finger flick. These are default behaviors, no import required, with axis rails so a vertical swipe still scrolls the page.

What you get

  • Pinch-zoom: two fingers zoom the x-axis around the pinch centroid, frame by frame.
  • Two-finger pan: drag the visible window with two fingers.
  • Kinetic inertia: a one-finger pan released with velocity keeps gliding and decelerates, clamping at the data edges with no elastic overshoot.
  • Axis rails: a vertical swipe still scrolls the page, so the chart never traps the scroll.

Configuration

The gestures are on by default; you tune or disable them through chart.zoom.pinch and chart.pan:

const options = {
  chart: {
    zoom: { enabled: true, pinch: true },       // pinch requires zoom.enabled
    pan: { inertia: true, friction: 0.92 },     // friction 0-1: lower stops sooner
  },
}

To opt out entirely, set zoom.pinch: false and pan.inertia: false.

When to tune it

The defaults suit most touch charts. Disable pinch on charts where zoom is meaningless (a single gauge or sparkline), or turn off inertia when a pan should stop the instant the finger lifts (for example a tightly synced dashboard). friction controls how far a flick coasts: lower values stop sooner, higher values glide longer.

Momentum is a core behavior, so there is no separate feature to import; it works out of the box on touch devices.