Javascript Highcharts标签分组

我正在制作一个图表，应该在一个类似于时间线的图表中显示状态。我认为最适合它的是水平条形图，我添加了如下数据：

series: [{
    data: [?],
    name: 'state1'
}, {
    data: [?],
    name: 'state2'
}, {
    data: [?],
    name: 'state3'
}, {
    data: [?],
    name: 'state1'
}, {
    ....
}, {
    data: [?],
    name: 'state1'
}]

以下是我得到的：

图表看起来像我需要的，但我需要以某种方式对图例进行分组，例如，本例中应该只有3个图例：state1、state2、state3

---

如何实现这样的目标？

根据@StAlex的答案，我建议使用类似的解决方案，但不使用ECMAScript 5特定的forEach：

var legends = {};
series.forEach(function(bar){
  legends[bar.name] = bar.data;
});

---

我假设数据是一个数字。如果不是这样，请添加注释。

我建议使用列范围系列类型的不同方法

通过这种方式，您可以只使用三个系列来完成此操作，每个时隙都有一个数据点，而不是每个时隙都有一个系列。这样可以避免操纵图例或伪造其他系列级动作

这是我为前面的问题所做的一个示例，该问题演示了仅具有两种状态的方法：

也可以很容易地适应使用日期时间轴，这似乎是您的目标。

在哪里使用linkedTo呢？

var legend = {};
for (var i = 0; i < series.length; i++) {
    var bar = series[i];
    if (!legend[bar.name]) {
        legend[bar.name] = 0;
    }
    legend[bar.name] += bar.data;
}