javascript - 使用 colorByPoint 时如何设置系列的图例符号颜色？

Question

我有一个包含两个系列(今年、去年)的柱形图，我想为某些“组”的柱设置颜色以表示季节，如下所示:

为此，我为每个系列设置了颜色，并使用了colorByPoint 选项。参见 this fiddle .

请注意，图表图例对两个系列的符号使用相同的灰色。 (我什至不确定那种灰色是从哪里来的——它不是来自任何一个系列的“调色板”颜色)。

如何为每个系列设置图例符号颜色？(理想情况下，我想为“今年”系列使用深灰色，以反射(reflect)颜色是该系列中的所有点都较暗)。

注意:虽然还有其他方法可以为每个数据点设置颜色，例如使用对象数组作为包含颜色设置的 data 参数，但我不想这样做，因为在我的真实示例中，数据来自 CSV 文件，通过 data 模块 - 所以我无法以这种方式使用对象。

Answer 1

基于 this previous answer我更新了代码以支持最新版本。

如果包装 Legend 类的 colorizeItem 函数，您可以使用 legendColor 属性:

(function(H) {
    H.wrap(H.Legend.prototype, 'colorizeItem', function(proceed, item, visible) {
        var color = item.color;
        item.color = item.options.legendColor;
        proceed.apply(this, Array.prototype.slice.call(arguments, 1));
        item.color = color;
    });
}(Highcharts));

你仍然应用legendColor:

$('#container').highcharts({
    series: [{
        legendColor: 'black',
        data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]
    }]
});

参见 this updated JSFiddle demonstration它在使用中。