我正在尝试切换多轴图表的堆叠,但似乎我一次只能切换一个系列。
有谁知道如何解决这个问题?这是jsfiddle的链接: http://fiddle.jshell.net/kz7wbykx/
var chart = new Highcharts.Chart({
chart: {
renderTo:'container',
defaultSeriesType:'column',
borderWidth:1,
borderColor:'#ccc',
marginLeft:110,
marginRight:50,
backgroundColor:'#eee',
plotBackgroundColor:'#fff',
},
title:{
text:'Chart Title'
},
legend:{
},
tooltip:{
},
plotOptions: {
series: {
stacking:'normal',
fillColor:'rgba(255,255,255,0)',
},
},
xAxis:{
lineColor:'#999',
lineWidth:1,
tickColor:'#666',
tickLength:3,
title:{
text:'X Axis Title'
}
},
yAxis:{
lineColor:'#999',
lineWidth:1,
tickColor:'#666',
tickWidth:1,
tickLength:3,
gridLineColor:'#ddd',
title:{
text:'Y Axis Title',
rotation:0,
margin:50,
}
},
series: [{
stack: 1,
name:'Series 1 Name',
data: [5,8,7,4,6]
},{
stack: 1,
name:'Series 2 Name',
data: [2,3,6,5,7]
},{
stack: 1,
name:'Series 3 Name',
data: [1,4,6,8,9]
}]
},function(chart){
$('button').click(function(){
chart.series[0].options.stack = +!chart.series[0].options.stack;
chart.series[1].options.stack = +!chart.series[1].options.stack;
//chart.series[2].options.stack = +!chart.series[2].options.stack;
chart.series[0].hide();
chart.series[1].hide();
chart.series[2].hide();
chart.series[0].show();
chart.series[1].show();
chart.series[2].show();
})
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://code.highcharts.com/highcharts.js"></script>
<div id="container" style="height: 400px"></div>
<button>toggle stacking</button>
&#13;
答案 0 :(得分:1)
我认为您可以在更改系列堆栈时使用Series.update()方法。在这里您可以找到有关此方法的信息: http://api.highcharts.com/highcharts#Series.update
$('button').click(function() {
chart.series[0].update({
stack: chart.series[0].options.stack == '1' ? '0' : '1'
}, false);
chart.series[1].update({
stack: chart.series[1].options.stack == '1' ? '2' : '1'
}, false);
chart.redraw();
})
在这里,您可以看到使用Series.update()的图表如何工作的示例: http://fiddle.jshell.net/kz7wbykx/1/
此致