將新系列添加到高圖堆疊柱狀圖的頂部

Question

我試圖控制新建（第一個渲染後）系列添加到Highcharts堆疊柱狀圖的順序。現在，如果您只是使用addSeries，則新添加的系列將添加到堆棧的底部。下面是我在做什麼

var chart = new Highcharts.Chart({ 

    chart: { 
     type: 'column', 
     renderTo: 'container' 
    }, 

    xAxis: { 
     categories: ['Jan', 'Feb', 'Mar'] 
    }, 

    plotOptions: { 
     series: { 
      stacking: 'normal' 
     } 
    }, 

    series: [{ 
     name: 'base', 
     data: [10, 20, 30] 
    }, { 
     name: 'sec', 
     data: [30, 20, 10] 
    }] 
}); 

var i = 0; 
$('#add').on('click', function (e) { 
    chart.addSeries({ 
     data: [32, 43, 42], 
     name: ++i, 
     index: 0 //?????? 
    }); 
}); 

下面是這個小提琴的簡化版本：http://jsfiddle.net/6bCBf/

任何人能想到辦法扭轉/控制，其中Highcharts插入新的系列？

我試着將新系列的索引設置爲0，但是什麼都不做。將其設置爲-1會將新系列添加到陣列的底部，但「堆疊」不能正常工作

Answer 1

您可以設置索引和zIndex以在圖層之間保持順序，然後添加具有適當參數的系列。

例子：http://jsfiddle.net/6bCBf/5/

var chart = new Highcharts.Chart({ 

    chart: { 
     type: 'column', 
     renderTo: 'container' 
    }, 

    xAxis: { 
     categories: ['Jan', 'Feb', 'Mar'] 
    }, 

    plotOptions: { 
     series: { 
      stacking: 'normal' 
     } 
    },  

    series: [ 
     { 
      name: 'base', 
      data: [10, 20, 30], 
      index:2, 
      zIndex:10 
     }, 
     { 
      name: 'sec', 
      data: [30, 20, 10], 
      index:1, 
      zIndex:9 
     } 
    ] 
},function(chart){ 



    $('#add').on('click', function (e) { 

     chart.addSeries({ 
      data: [32, 43, 42], 
      index: 0, 
      zIndex:1 
     }); 
    }); 


});