更新：这是一个显示问题的jsfiddle：http://jsfiddle.net/pynju/1/
点击星期一的蓝色栏目。加载详细视图时，请注意01-07有3列（预期为2）。单击最高的栏以返回原始视图。请注意，xAxis上的标签未被删除。
===============
我有一个条形图，有2个系列，并排显示为成对的条形图。
series: [{
showInLegend: false,
data: dowChartData
},{
showInLegend: false,
data: avgUserDowChartData
}],
.
dowChartData = [ {
y: 98.74,
color: '#0072ff',
drilldown: {
name: 'Category Engagement - Sunday',
categories: ['00','01','02','03','04','05','06','07','08','09','10','11','12','13','14','15','16','17','18','19','20','21','22','23'],
data: [0,637,0,0,0,173,48.54,48.54,0,0,0,0,0,0,102.24,166.36,706.59,699.18,298.32,184.14,97.08,1539,0,1224.56],
color: '#0072ff',
data2: [506.80686467275,354.56354558498,333.25158689567,234.19283190879,234.82132336088,220.03247578171,222.86420797556,218.14034615202,170.42559544164,171.54776353196,249.24788461442,345.14915669555,206.65543589797,243.38811965637,367.02593304906,378.83677778129,467.45739743621,424.26264387522,639.60922934374,679.71299714907,373.26353846375,480.94380626458,551.82326068362,466.77469230724],
color2: '#C00'
}
}
AND SIMILAR
.
avgUserDowChartData = [ {
y: 142.35,
color: '#C00'
},
AND SIMILAR
初始数据是星期几数据，X轴为：星期日 - 星期一 - 星期二 - 星期三 - 星期四 - 星期五 - 星期六
初始系列有一个带有新数据和数据2的钻取元素（见上文）
以钻取演示代码为例，我已经有了这个代码：
column: {
borderWidth: 0,
cursor: 'pointer',
point: {
events: {
click: function(event) {
var drilldown = this.drilldown;
if (drilldown) { // drill down
setChart(dowChart, drilldown.name, drilldown.categories, drilldown.data, drilldown.color, drilldown.data2, drilldown.color2);
} else { // restore
setChart(dowChart, '', dowCategories, dowChartData);
}
}
}
},
设置图表处理程序
function setChart(chart, name, categories, data, color, data2, color2) {
chart.xAxis[0].setCategories(categories);
// chart.series[0].remove();
for (var i = 0; i < chart.series.length; i++) {
chart.series[i].remove();
}
chart.addSeries({
showInLegend: false,
name: name,
data: data,
color: color || 'white'
});
if (typeof(data2) != undefined && data2.length > 0) {
chart.addSeries({
showInLegend: false,
name: name,
data: data2,
color: color2 || 'white'
});
}
}
初始图表显示完美：
当您单击任何蓝色条形图（具有向下钻取的数据集）时，前7个x轴项目的情况会变得很糟糕：
就像代码中没有删除初始数据集一样：
for (var i = 0; i < chart.series.length; i++) {
chart.series[i].remove();
}
当您单击任何栏以打算重置为原始数据集/系列时：
所以...很明显我正在使用的删除系列代码不起作用。完全删除图表上的数据的最佳方法是什么，我需要每次显示2个系列，具体取决于点击的内容？
试试这个删除所有图表系列，
while(chart.series.length > 0)
chart.series[0].remove(true);
这个对我有用。代码
for (var i = 0; i < chart.series.length; i++)
因为每次调用chart.series.length时remove()都会减少，所以不会起作用。这样，i永远不会达到预期的长度。希望这可以帮助。
以下方式图表不会重绘每次迭代。 所以你会获得更好的表现。
while( chart.series.length > 0 ) {
chart.series[0].remove( false );
}
chart.redraw();
使用for循环删除HighCharts中所有系列的另一种方法是从头开始。这是怎么做的：
var seriesLength = chart.series.length;
for(var i = seriesLength - 1; i > -1; i--) {
chart.series[i].remove();
}
我更喜欢这条路线，因为在使用HighStock图表时，导航仪通常是第一个系列。我也更喜欢将变量设置为导航器系列。在这种情况下，我会做以下事情：
var seriesLength = chart.series.length;
var navigator;
for(var i = seriesLength - 1; i > -1; i--) {
if(chart.series[i].name.toLowerCase() == 'navigator') {
navigator = chart.series[i];
} else {
chart.series[i].remove();
}
}
现在我可以轻松设置导航系列。
以下是从Highchart中删除所有系列的示例：http://jsfiddle.net/engemasa/srZU2/
以下是使用新数据（包括导航系列）重置HighStock图表的示例：http://jsfiddle.net/engemasa/WcLQc/
for (var i = 0; i < chart.series.length; i++)不起作用的原因是因为你在循环它时修改数组。要解决这个问题，您可以从右到左遍历数组，因此当您删除元素时，数组的索引仍将指向数组中的最后一项。
使用lodash的forEachRight，您可以：
_.forEachRight(chart.series, chartSeries => {
chartSeries.remove(false);
});
chart.redraw();
告诉图表重绘可能只是一件简单的事情。删除系列时，请尝试强制重绘图表：
for (var i = 0; i < chart.series.length; i++) {
chart.series[i].remove(true); //forces the chart to redraw
}
var seriesLength = chart.series.length;
for(var i = seriesLength -1; i > -1; i--) {
chart.series[i].remove();
}
您还可以更新和添加新系列，如果新系列小于当前系列，则删除系列：
var hChart = $("#Chart").highcharts();
for (var i = 0; i < newSeries.length; i++) { //UPDATE-OLD/ADD-NEW SERIES
if (hChart.series[i])
hChart.series[i].update(newSeries[i]);
else
hChart.addSeries(newSeries[i]);
}
var serieslen = newSeries.length;
if (hChart.series[serieslen]) {
var loopfrm = hChart.series.length - 1;
for (var i = loopfrm; i >= serieslen; i--) {//REMOVE SERIES
hChart.series[loopfrm].remove();
}
}
我找到了工作解决方案。试试这个：
for (var i = 0; i < chart.series.length; i++) {
chart.series[0].remove();
}
chart.redraw();
它将完全删除所有系列。