2014-07-07 2 views
1

저는이 문제로 꽤 오래 고민하고 있습니다. 나는 highcharts와 javascript가있는 초보자이며이 문제에 부딪혔다. 어떻게 해결할 지 모르겠다. 그리고 도움이된다.Highcharts에서 전처리 된 데이터와 드릴 다운 결합

.csv 파일을 읽고 데이터를 가져 와서 yAxis 및 xAxis 이름 및 범주 등으로 차트를 자동으로 만드는 하이 차트 차트가 있습니다.이 차트에 드릴 다운 기능을 추가하는 것이 었습니다. 드릴 다운 차트뿐만 아니라 데이터를 전처리,하지만 시간 동안 내가 그렇게 http://jsfiddle.net/yw4Vh/

series: [{data: [{ name: 'Fruits', y: 10, drilldown: 'fruits'

같은 데이터를 드릴 다운을 설정하려고 만하고있는 한 어떤 이유로 때 내 코드를 통해 내가 루프는 내가 캔트처럼 각 행에 대한 드릴 다운을 설정하십시오. 내가 붙어있어서 자바 스크립트 코드에 대한 오류도 발생하지 않습니다. 온라인으로 많은 다른 예를 보았지만 이것이 도움이되지 않았습니다. 설명없이 일부 코드를 연결할 수 없다면 가능하면 제발, 많은 도움이 될 것입니다. 이것은 제 코드입니다. 특히이 부분은 문제가있는 부분입니다. 각 행에 series.data.drilldown에 series.name을 어떻게 할당 할 수 있습니까?? 내 코드에

링크 : http://jsfiddle.net/vF5C8/1/

$.get('prof2.csv', function(data) { 
      // Split the lines 
      var lines = data.split('\n'); 
      $.each(lines, function(lineNo, line) { 
       var items = line.split(';'); 


       // header line containes categories 
       if (lineNo == 0) { 
        $.each(items, function(itemNo, item) { 
         if (itemNo > 0) options.xAxis.categories.push(item); 

        }); 
       } 

       // the rest of the lines contain data with their name in the first position 
       else { 
        var series = { 
         data: [], 
         visible:false, 
         type: 'column' 

        } 
        $.each(items, function(itemNo, item) { 
         if (itemNo == 0) { 
          series.name = item; 
          series.data.drilldown = 'item'; 

         } else { 
          series.data.push(parseFloat(item)); 
         } 

        }); 


        options.series.push(series); 

       } 

      }); 

      var chart = new Highcharts.Chart(options); 
     }); 

샘플 코드 내 .CSV 파일

1995;1996;1997;1998;1999;2000;2001;2002;2003;2004;2005;2006;2007;2008 
Ál;18461;27588;20862;25185;27946;20323;22082;;;;;;; 
Bles;3237;2947;3185;3245;3319;3563;3710;;;;;;; 
Díl;2550;2980;2762;1894;1657;2161;3352;;;;;;; 
Dugg;101;173;232;86;183;204;238;;;;;;; 
Fýll;8059;8920;10093;9037;7739;10495;10323;;;;;;; 
Gr;35350;37657;41240;38017;35038;32510;35692;;;;;;; 
Háv;2022;1860;1556;1496;1843;1949;1924;;;;;;; 
Heið;10695;12182;14674;15396;13903;14271;12557;;;;;;; 
Hel;1876;1619;2629;2283;1376;1412;1409;;;;;;; 
Hett;2958;2696;2854;2306;1910;1527;1274;;;;;;; 
Hra;7119;6653;5987;5564;4555;3087;3884;;;;;;; 
Hreir;329;361;260;300;406;359;462;;;;;;; 
Hvít;3942;4546;3771;3187;5496;4251;3111;;;;;;; 
Kj;2617;2292;1993;1752;1302;1293;1183;;;;;;; 
Lan;52867;65179;59529;65612;59797;66567;52839;;;;;;; 

답변

2

문제에서 당신이 점 시리즈 (드릴 다운)을 연결 않는 방법이다. 당신은 지금 :

drilldown: { 
     series: [{ 
      id: '1994', 
      data: [ 
       ['AU', 14], 
       ['NE', 21], 
       ['NV', 12], 
       ['SU', 15], 
       ['VE', 16], 
       ['VF', 34] 
      ] 
     } ... ] 

시리즈의 ID는 1994입니다. 지금, 당신은 1 레벨 시리즈의 포인트가있을 때 :

  $.each(items, function (itemNo, item) { 
       if (itemNo == 0) { 
        series.name = item; 
        series.data.drilldown = 'apple'; // remove that - it's just wrong 

       } else { 
        series.data.push(parseFloat(item)); //adding points to series 
       } 
      }); 

당신은 다음과 같이 드릴 시리즈 링크, 각 지점, drilldown 속성에 추가해야합니다 :

    series.data.push({ 
         y: parseFloat(item), 
         drilldown: '1994' // must match with `id` in drilldown.series 
        }); //adding points to series with drilldown 

그리고 그게 다야. 어떤 지점 드릴 다운을 결정해야합니다.

+0

정말 고마워요. 당신은 문자 그대로 나를 엄청난 도움이되었습니다. 고맙습니다. – plurbus

+0

그럼 내 대답을 수락하십시오 (0 값 근처 - 녹색 기호;)). –