如何在Highcharts图例中将colorAxis颜色显示为系列颜色？

Question

我正在尝试使用Highcharts显示颜色编码的饼图。在图例中，每个系列应具有基于minColor和maxColor的颜色。

在第一次渲染时，这不起作用（图例具有默认颜色，如蓝色，黑色和绿色），并且只有在redraw()事件正确的颜色出现在图例中之后。

[我想避免手动调用redraw()方法，因为我有很多图表是从外部API动态获取其数据的，所以手动进行操作会增加我的代码复杂性。

有什么想法或建议吗？

您可以在这里看到工作示例：https://jsfiddle.net/p0cf392j/（调整浏览器窗口的大小以触发redraw()事件，并在图例中查看系列颜色的变化）

Answer 1

该问题是Highcharts错误，我已经在这里报告了：https://github.com/highcharts/highcharts/issues/12710

作为一种解决方法，您可以覆盖translateColors方法：

(function(H) {
    H.Series.prototype.translateColors = function() {
        var series = this,
            points = this.data.length ? this.data : this.points,
            nullColor = this.options.nullColor,
            colorAxis = this.colorAxis,
            colorKey = this.colorKey;

        points.forEach(function(point) {
            var value = point[colorKey],
                color;

            color = point.options.color ||
                (
                    point.isNull ?
                    nullColor :
                    (colorAxis && typeof value !== 'undefined') ?
                    colorAxis.toColor(value, point) :
                    point.color || series.color
                );

            if (color && point.color !== color) {
                point.color = color;

                if (series.options.legendType === 'point') {
                    series.chart.legend.colorizeItem(point, point.visible);
                }
            }
        });
    }
}(Highcharts));

---

实时演示： https://jsfiddle.net/BlackLabel/ht0nwvxj/

文档： https://www.highcharts.com/docs/extending-highcharts/extending-highcharts