score:6

Accepted answer

There is no such feature in Highcharts nor in Highstock. You could add a mouse wheel event and bind it with a setExtremes function for yAxis.

http://jsfiddle.net/3q79ey8h/1/

(function(H) {

  //internal functions
  function stopEvent(e) {
    if (e) {
      if (e.preventDefault) {
        e.preventDefault();
      }
      if (e.stopPropagation) {
        e.stopPropagation();
      }
      e.cancelBubble = true;
    }
  }

  //the wrap
  H.wrap(H.Chart.prototype, 'render', function(proceed) {
    var chart = this,
      mapNavigation = chart.options.mapNavigation;

    proceed.call(chart);

    // Add the mousewheel event
    H.addEvent(chart.container, document.onmousewheel === undefined ? 'DOMMouseScroll' : 'mousewheel', function(event) {

      var delta, extr, step, newMin, newMax, axis = chart.yAxis[0];

      e = chart.pointer.normalize(event);
      // Firefox uses e.detail, WebKit and IE uses wheelDelta
      delta = e.detail || -(e.wheelDelta / 120);
      delta = delta < 0 ? 1 : -1;

      if (chart.isInsidePlot(e.chartX - chart.plotLeft, e.chartY - chart.plotTop)) {
        extr = axis.getExtremes();
        step = (extr.max - extr.min) / 5 * delta;
        axis.setExtremes(extr.min + step, extr.max + step, true, false);
      }

      stopEvent(event); // Issue #5011, returning false from non-jQuery event does not prevent default
      return false;
    });
  });
}(Highcharts));

Related Query

More Query from same tag