Как настроить высокие графики так, чтобы все кривые всегда отображались / выделялись?

Question

Я хотел бы настроить верхние графики таким образом, чтобы при наведении курсора мыши на график все кривые оставались отображенными / выделенными, а значение ближайшей к мыши кривой отображалось.

В этом примере jsfidleпредоставлено @Wojciech Chmiel: [https://jsfiddle.net/BlackLabel/rLg0kwp7]

var monoChart = Highcharts.chart('container', {
	chart: {
  	zoomType: 'xy'
  },
  series: [{
    data: [
      439,
      525,
      571,
      696,
      970,
      119,
      137,
      154
    ]
  }, {
    data: [
      234,
      123,
      444,
      322,
      543,
      657
    ]
  }],
});

monoChart._highChartsZoom = monoChart.zoom;
monoChart.zoom = function(e) {
  this._highChartsZoom(e);
}.bind(monoChart);

<script src="https://code.highcharts.com/highcharts.js"></script>
<div id="container"></div>

Мы можем видеть, что если мышь находится рядом с кривой «Серии 1», отображается ближайшее значение (что здорово), но кривая «Серии»2 "был скрыт автоматически, что я хотел бы избежать в моем случае.См. Снимок экрана: пример отображения интерактивной диаграммы с высокими диаграммами

Я хотел бы иметь тот же дисплей, но со всеми кривыми, отображаемыми / подсвечиваемыми, даже если пользователь делает «наведение мыши»на графике.

Любая помощь будет признательна.

Answer 1

Вы можете отключить состояние inactive, установив opacity в параметре состояния на 1.

  plotOptions: {
    series: {
        states: {
        inactive: {
            opacity: 1
        }
      }
    }
  },

Справочник по API: https://api.highcharts.com/highcharts/series.line.states.inactive.opacity

Демонстрация: https://jsfiddle.net/BlackLabel/rLg0kwp7/2/