pannable Boolean|Object (default: false)

Specifies if the chart can be panned.

Example - enable panning

<div id="chart"></div>
<script>
  $("#chart").kendoChart({
    series: [{
      data: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
    }],
    pannable: true,
    categoryAxis: {
      categories: ["A", "B", "C", "D", "E", "F", "G", "H", "I", "J"],
      min: 2,
      max: 5
    }
  });
</script>

pannable.key String (default: "none")

Specifies the key that should be pressed to activate panning. The supported values are:

• "none" - No key is required.
• "ctrl" - The "ctrl" key should be pressed.
• "shift" - The "shift" key should be pressed.
• "alt" - The "alt" key should be pressed.

Example - set the pannable key

<div id="chart"></div>
<script>
  $("#chart").kendoChart({
    series: [{
      data: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
    }],
    pannable: {
      key: "shift"
    },
    categoryAxis: {
      categories: ["A", "B", "C", "D", "E", "F", "G", "H", "I", "J"],
      min: 2,
      max: 5
    }
  });
</script>

pannable.lock String (default: "none")

Specifies an axis that should not be panned. The supported values are none, x and y.

Example - lock the y axis

<div id="chart"></div>
<script>
  $("#chart").kendoChart({
    series: [{
      data: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
    }],
    pannable: {
      lock: "y"
    },
    valueAxis: {
      min: 2,
      max: 7
    },
    categoryAxis: {
      categories: ["A", "B", "C", "D", "E", "F", "G", "H", "I", "J"],
      min: 2,
      max: 5
    }
  });
</script>