Highcharts Plotoptions Series

Question

В настоящее время я использую Highcharts на своем сайте. В одной из моих диаграмм (базовая диаграмма столбцов) у меня есть несколько серий, которые я могу щелкнуть по имени, отображаемому внизу, чтобы показать/скрыть.

У меня может быть много серий, и я бы хотел ограничить количество серий до 3 одновременно. Это означает, что когда он загружает график, он показывает только 3 серии, а остальные не отображаются. Если я нажму на 4-ю серию, один из трех первоначально присутствующих исчезнет, ​​так что количество активных серий всегда останется 3.

Я искал его, и я выяснил, что мне нужно было внести некоторые изменения в поле plotOptions.series, и я выкопал ссылку на ссылку Highcharts API, но не нашел того, что хотел. Моя первая попытка в коде будет что-то вроде этого:

$('#container').highcharts({ 
    plotOptions:{ 
     series: { 
      var series = this.series; 
      var nb_of_visible_series = 0;    

      //Here i count the number of visible series 
      for(var i=0; i<series.length; i++) { 
       if(series[i].visible) { 
        nb_of_visible_series++: 
       } 
      } 

      //If too many series are visible I'll randomly 
      //hide as many series as necessary 
      if(nb_of_visible_series>3) { 
       var nb_of_series_to_hide = nb_of_visible_series-3; 
       while(nb_of_series_to_hide>0) { 
        var i=Math.floor(Math.random()*series.length); 
        if(series[i].visible) { 
         series[i].hide() 
         nb_of_series_to_hide--; 
        } 
       } 
      } 
     } 
    } 
} 

Так что это идея, но я не знаю, куда поместить его для реальных (а не непосредственно в plotOptions.series поле так же, как это я думаю?) , Я могу положить его в plotOptions.series.events.legentItemClick, но тогда он не будет учитываться при загрузке диаграммы.

Я ищу некоторые треки и советы о моем коде (я начинаю JS) и благодарю вас в Advance. И сожалею о моем бедном английском.

Answer 1

Наверняка код, который вы написали, не будет работать. Варианты Highcharts должен быть JavaScript Object, а не какой-нибудь предмет смешиваться между переменными, опционами и т.д.

1) Для того, чтобы получить на экране INIT только три данных серии предварительной обработки, что-то вроде этого:

var series = [{ data: [..], name: 'name 1' ..} , { data: [..], name: 'name 2' ..} , ... , {data: [..], name: 'name n'}]; 

for (var i = 0, len = series.length; i < len; i++) { 
    series[i].visible = i < 3; //setup variable series.visible to show/hide on init load. 
} 

$('#container').highcharts({ 
    series: series //pass variable with updated visible option 
}); 

2) Как Вы заметили, что вам нужно написать свою собственную функцию для legendItemClick, которая проверит, сколько рядов видно (цикл chart.series и счет series.visible == true). Затем скрыть/показать определенные серии, используя series.hide()/series.show().