2012-10-23 76 views
0

這是Highcharts論壇一個老問題的工作, http://www.google.com/url?sa=t&rct=j&q=&esrc=s&source=web&cd=2&ved=0CC4QFjAB&url=http%3A%2F%2Fwww.highslide.com%2Fforum%2Fviewtopic.php%3Ff%3D9%26t%3D16573&ei=J_2GUM7fEoSC9QT0lICoCA&usg=AFQjCNGq_GxmSd0YUxWUyy96UHLZA0zb9w&sig2=RzAkhldNbvCowk8I1kmRVg如何使Highcharts鑽成多列

今天我實現它,並在論壇上發帖的解決方案的工作。但是,我需要制定一個自定義解決方案,該解決方案是具有3列的2級向下鑽取圖表。爲了澄清,論壇上提供的解決方案僅適用於第一個圖表上的2列,然後是深入1列。我的圖表需要初始圖表和深入圖表上的3列。

我不明白鑽取轉換及其工作原理,因此我很難定製代碼。實現中也有相當多的重複代碼,所以如果有人對Highcharts深入瞭解有更好的理解,請隨時分享一些關於如何使其工作的建議。

代碼的關鍵部分是

  var drilldown = this.drilldown; 

      if (drilldown) { // drill down 
       setChart(drilldown.name, drilldown.categories, drilldown.data, drilldown.color); 
      } else { // restore 
       setChart(name, categories, data); 

      } 

和setChart():

function setChart(name, categories, data) { 
     chart.counters.color = 0; 
     chart.xAxis[0].setCategories(categories); 
     while (chart.series.length > 0){ 
      chart.series[0].remove(true); 
     } 
     for (var i = 0; i < data.length; i++) { 
      chart.addSeries({ 
       name: name[i], 
       data: data[i] 
      }); 
     } 
    } 

如何確定this.drilldown和輸入setChart()是作出正確選擇的關鍵。

我曾嘗試的小提琴是:http://jsfiddle.net/dTkh4/2/

回答

0

答案是在

var drilldown = this.drilldown; 

if (drilldown) { // drill down 
    setChart(drilldown.name, drilldown.categories, drilldown.data); 

} else { // restore 
    setChart([name1, name2, name3], categories1, [data1, data2, data3]); 
} 

爲了鑽取視圖,示出3分離列,drilldown.name和drilldown.data需要成爲嵌套數組3並且每個子數組都具有每個類別的值。對於還原部分,添加name3以在還原而不是2時顯示3列。