議案在下拉式氣泡圖Highcharts

我已經爲氣泡圖創建了下拉式。爲此深入分析數據是這樣的：議案在下拉式氣泡圖Highcharts

drilldown: { 
     series: [{ 
      id: 'animals', 
      data: [ 
       ['Cats', 5], 
       ['Dogs', 2], 
       ['Cows', 1], 
       ['Sheep', 2], 
       ['Pigs', 1] 
      ] 
     }, { 
      id: 'fruits', 
      data: [ 
       ['Apples', 4], 
       ['Oranges', 2] 
      ] 
     }, { 
      id: 'cars', 
      data: [ 
       ['Toyota', 4], 
       ['Opel', 2], 
       ['Volkswagen', 2] 
      ] 
     }] 
    }

我可以按順序使用數據進行深入分析的如： ID：動物的數據將是如此，當我滾動水平數據點的貓將呈現一個接一個。

data: [ 
       ['Cats', [5,1,2,3,4]], 
       ['Dogs', [2,1,5,6,7]] 
      ]

JSFiddle

來源

2016-08-09 Raju Rajoriya

所以，你想獲得多個系列深入？你可以在這種情況下看到這個SO主題：http://stackoverflow.com/questions/38001100/highcharts-drilldown-and-combining-chart-type/38007444#38007444在這裏你可以找到與這個問題有關的Highcharts論壇主題： http://forum.highcharts.com/highcharts-usage/drill-down-from-line-to-multiple-series-t35350/ –

Motion插件目前不支持深入鑽取系列，但它很可能實現。

您的JSFiddle在正確的路徑上，但它需要一個解決方法讓Motion在圖表向下鑽取時注意到系列中的更改。

JSFiddle的工作解決方案：http://jsfiddle.net/larsac07/Lon306y5/。

下鑽系列都爲運動準備和運動必須知道在發生一系列的變化：通過圖表事件

// Array that keeps track of prepared drilldown series. 
var preparedDrilldowns = []; 

// This function is called for each series, including drilldown 
// series, and prepares it by setting an initial value for each 
// point if the series is not already prepared. 
function prepareDrilldowns(e) { 
    var chart = e.target, 
     motion = chart.motion, 
     value; 
    if (motion) { 
     Highcharts.each(chart.series, function (series) { 
      if (preparedDrilldowns.indexOf(series.name) < 0) { 
       Highcharts.each(series.points, function (point) { 
        value = point.sequence[motion.round(motion.playRange.value)]; 
        point.update(value, false, false); 
       }); 
       preparedDrilldowns.push(series.name); 
       series.chart.redraw(); 
      } 
     }); 
    } 
} 

// This function updates Motion with the current series (when 
// drilldown is triggered, the current chart series are swapped). 
function updateChart(e) { 
    var motion = e.target.motion; 
    if (motion) { 
     motion.dataSeries = e.target.series; 
    } 
}

通話功能：

chart: { 
    events: { 
     // Called for each redraw 
     redraw: function (e) { 
      // Call updateChart() for each redraw 
      updateChart(e); 

      // This is only called once per series and 
      // drilldown series. 
      prepareDrilldowns(e); 
     } 
    } 
}

來源

2016-08-10 15:41:14

追溯圖表並不意味着使用這種方式。它們旨在顯示數據的類別和子類別。您不能深入到子類別，然後將一組數據與另一組數據進行比較。

根據您的樣本數據，我有兩個建議：

開始與三個主要的類別（動物，水果，汽車），並讓他們深入到子類別（例如，「動物」演習到貓，狗，牛，羊，豬）。每個類別和子類別（五隻貓，兩隻狗等）只有一列。
從兩個主要類別（貓，狗）開始，並讓它們鑽入其子類（例如，「貓」鑽到值[5,1,2,3,4]）。你需要有一個理由來比較貓和狗（可能是五頭短毛，一頭長毛，兩頭混血狗等）。

想一下你想向你的讀者解釋什麼樣的比較，以及他們理解這些比較的最明確和最簡單的方法。

來源

2016-08-09 11:45:55

我沒有在這裏比較價值。我的意思是當同一個鍵有多個數據點時。例如['貓'，[5,1,2,3,4] .Cats有5個值，所以當我滾動這些值應逐一呈現。 –

@RajuRajoriya還行。在這種情況下，您需要總共可以深入到[[5,1,2,3,4]]值的貓。代碼示例會有幫助嗎？ –

是的。當playAxis移動數據點時，運動中的圖表會發生相同的情況。當我滾動 –

議案在下拉式氣泡圖Highcharts

回答

相關問題