我有多个系列要在柱状图中呈现,但其中一些列的值为零,图表为空列留出了空间。如何隐藏/删除空列,如本例中6月15日的Category 2:JSFILLDE
$('#container').highcharts({
chart: {
type: 'column'
},
title: {
text: 'Stacked bar chart'
},
xAxis: {
type: 'datetime',
},
yAxis: {
min: 0,
title: {
text: 'Testing'
}
},
series: [{
name: 'Category I',
data: [
[Date.UTC(2014, 5, 14), 20],
[Date.UTC(2014, 5, 15), 30],
[Date.UTC(2014, 5, 16), 25],
[Date.UTC(2014, 5, 19), 10],
[Date.UTC(2014, 5, 20), 15]
]
}, {
name: 'Category II',
data: [
[Date.UTC(2014, 5, 14), 25],
//[Date.UTC(2014, 5, 15), 10],
[Date.UTC(2014, 5, 16), 35],
[Date.UTC(2014, 5, 19), 25],
[Date.UTC(2014, 5, 20), 5]
]
}, {
name: 'Category III',
data: [
[Date.UTC(2014, 5, 14), 10],
[Date.UTC(2014, 5, 15), 20],
[Date.UTC(2014, 5, 16), 35],
//[Date.UTC(2014, 5, 19), 25],
[Date.UTC(2014, 5, 20), 15]
]
}]
});
您可以尝试使用堆叠,并在系列中使用stack进行一些操作,但图表的视图将更改。
$(function () {
$('#container').highcharts({
chart: {
type: 'column'
},
title: {
text: 'Stacked bar chart'
},
xAxis: {
type: 'datetime',
},
yAxis: {
min: 0,
title: {
text: 'Testing'
}
},
plotOptions : {
column: {
stacking: 'normal'
}
},
series: [{
name: 'Category I',
data: [
[Date.UTC(2014, 5, 14), 20],
[Date.UTC(2014, 5, 15), 30],
[Date.UTC(2014, 5, 16), 25],
[Date.UTC(2014, 5, 19), 10],
[Date.UTC(2014, 5, 20), 15]
],
stack : 0
}, {
name: 'Category II',
data: [
[Date.UTC(2014, 5, 14), 25],
//[Date.UTC(2014, 5, 15), 10],
[Date.UTC(2014, 5, 16), 35],
[Date.UTC(2014, 5, 19), 25],
[Date.UTC(2014, 5, 20), 5]
],
stack : 0
}, {
name: 'Category III',
data: [
[Date.UTC(2014, 5, 14), 10],
[Date.UTC(2014, 5, 15), 20],
[Date.UTC(2014, 5, 16), 35],
//[Date.UTC(2014, 5, 19), 25],
[Date.UTC(2014, 5, 20), 15]
],
stack : 2
}]
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="http://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/modules/exporting.js"></script>
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>