# Pan Region

In this example pan is only accepted at the middle region (50%) of the chart. This region is highlighted by a red border.

const zoomOptions = {
  limits: {
    x: {min: -200, max: 200, minRange: 50},
    y: {min: -200, max: 200, minRange: 50}
  },
  pan: {
    enabled: true,
    onPanStart({chart, point}) {
      const area = chart.chartArea;
      const w25 = area.width * 0.25;
      const h25 = area.height * 0.25;
      if (point.x < area.left + w25 || point.x > area.right - w25
        || point.y < area.top + h25 || point.y > area.bottom - h25) {
        return false; // abort
      }
    },
    mode: 'xy',
  },
  zoom: {
    wheel: {
      enabled: false,
    },
    pinch: {
      enabled: true
    },
  }
};
Last Updated: 11/16/2021, 3:06:42 PM