하이 차트 Plotoptions Series

Question

현재 내 웹 사이트에서 Highcharts를 사용 중입니다. 내 차트 (기본 세로 막 대형 차트) 중 하나에서 여러 시리즈를 볼 수 있으며, 아래쪽에 표시된 이름을 클릭하여 표시/숨길 수 있습니다.

나는 시리즈를 많이 가질 수 있으며 동시에 시리즈 수를 3 개로 제한하고 싶습니다. 그래프로드시 3 계열 만 표시되고 다른 그래프는 표시되지 않습니다. 네 번째 세리를 클릭하면 원래 존재하는 세 개 중 하나가 사라지므로 활성 세리에의 수는 항상 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

작성한 코드는 작동하지 않습니다.

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)로 : Highcharts에 대한 옵션은 다음과 같이 자바 스크립트 객체가 아닌 변수, 옵션 등

1) 사이에 혼합 어떤 것을 초기화하기 세 개의 시리즈 전처리 데이터를 표시하려면 뭔가해야 당신이 legendItemClick에 대한 자신 만의 함수를 작성할 필요가 있다는 것을 알아 채 셨습니다.이 함수는 얼마나 많은 시리즈가 보이는지 확인합니다 (루프 chart.series 및 카운트 series.visible == true 통해). 그런 다음 series.hide()/series.show()을 사용하여 특정 시리즈를 숨기거나 표시하십시오.