如何重置Highcharts中为系列提供的样式？

Question

我正在使用Highcharts为我的网站渲染一些图表.有时,我需要从图表中删除所有系列并向图表添加一些新系列,因为我通过ajax请求了一些新数据.

我目前正在这样做:

var chart = $('#container').highcharts();
while(chart.series.length) {
    chart.series[0].remove();
}

chart.addSeries({
    data: [144.0, 176.0, 29.9, 71.5, 106.4, 129.2, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]
});
chart.addSeries({
    data: [129.2, 106.4, 135.6, 95.6, 54.4, 148.5, 144.0, 176.0, 29.9, 71.5, 216.4, 194.1]
});
chart.addSeries({
    data: [106.4, 129.2, 135.6, 148.5, 144.0, 176.0, 29.9, 71.5, 194.1, 95.6, 54.4, 216.4]
});

你可以在这个小提琴中看到.

但我的问题是,新系列与第一批系列的颜色完全不同.

我不能简单地替换数据,因为系列的数量可能会改变,所以我必须删除所有系列并添加新系列.

如何归档新系列的样式与替换的系列相似？(在我的小提琴中,新系列应该有浅蓝色,深蓝色和一些第三种颜色.)

测试用例

我创建了一些测试用例来澄清我面临的问题.顶部图表是它应该如何看,底部图表是它的实际外观.我希望他们是一样的!

1. 删除两个系列并添加两个系列
2. 删除两个系列并添加三个系列
3. 删除三个系列并添加两个系列

解决方案需要适用于所有这些情况!

Answer 1

我在GitHub上的pull请求中找到了解决方案(https://github.com/highslide-software/highcharts.com/pull/203).

您只需在删除系列后重置Highcharts颜色计数器.还有一个符号计数器.

更新:从4.0.3及更高版本开始,计数器的名称已更改:

var chart = $('#container').highcharts();
while(chart.series.length) {
    chart.series[0].remove();
}

chart.colorCounter = 0;
chart.symbolCounter = 0;

chart.addSeries({
     data: [144.0, 176.0, 29.9, 71.5, 106.4, 129.2, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]
});
chart.addSeries({
    data: [129.2, 106.4, 135.6, 95.6, 54.4, 148.5, 144.0, 176.0, 29.9, 71.5, 216.4, 194.1]
});
chart.addSeries({
    data: [106.4, 129.2, 135.6, 148.5, 144.0, 176.0, 29.9, 71.5, 194.1, 95.6, 54.4, 216.4]
});

实例:http://jsfiddle.net/juuQs/18/

(在4.0.3版之前,您必须使用chart.counters.color = 0和chart.counters.symbol = 0)