Highcharts - Как отделить функционал навигатора от графика

Question

После добавления навигатора на график старшей диаграммы, как мы можем запретить навигатору изменять движение графика.
Есть ли для этого обработчик событий?

Я бы хотел, чтобы навигатор былна экране, но отключите его работу с графиком.

Answer 1

Вы можете достичь этого, переписав основные методы.

1) уничтожить всю функциональность:

(function(H) {
    H.Navigator.prototype.addMouseEvents = function() {}
})(Highcharts);

Демонстрация:

• https://jsfiddle.net/BlackLabel/2zk93ysx/1/

2) предотвращение изменения крайностей диаграммы при перемещении ручек навигатора:

(function(H) {
  H.Navigator.prototype.onMouseUp = function(e) {
    var navigator = this,
      chart = navigator.chart,
      xAxis = navigator.xAxis,
      scrollbar = navigator.scrollbar,
      unionExtremes,
      fixedMin,
      fixedMax,
      ext,
      DOMEvent = e.DOMEvent || e;

    if (
      (navigator.hasDragged && (!scrollbar || !scrollbar.hasDragged)) ||
      e.trigger === 'scrollbar'
    ) {
      unionExtremes = navigator.getUnionExtremes();

      // When dragging one handle, make sure the other one doesn't change
      if (navigator.zoomedMin === navigator.otherHandlePos) {
        fixedMin = navigator.fixedExtreme;
      } else if (navigator.zoomedMax === navigator.otherHandlePos) {
        fixedMax = navigator.fixedExtreme;
      }
      // Snap to right edge (#4076)
      if (navigator.zoomedMax === navigator.size) {
        fixedMax = navigator.reversedExtremes ?
          unionExtremes.dataMin : unionExtremes.dataMax;
      }

      // Snap to left edge (#7576)
      if (navigator.zoomedMin === 0) {
        fixedMin = navigator.reversedExtremes ?
          unionExtremes.dataMax : unionExtremes.dataMin;
      }

      ext = xAxis.toFixedRange(
        navigator.zoomedMin,
        navigator.zoomedMax,
        fixedMin,
        fixedMax
      );
    }

    if (e.DOMType !== 'mousemove') {
      navigator.grabbedLeft = navigator.grabbedRight =
        navigator.grabbedCenter = navigator.fixedWidth =
        navigator.fixedExtreme = navigator.otherHandlePos =
        navigator.hasDragged = navigator.dragOffset = null;
    }
  }
})(Highcharts);

Демонстрация:

• https://jsfiddle.net/BlackLabel/L9wxf5c4/