Highcharts的图例颜色是否与饼图的扇区颜色相同?

snvhrwxg  于 2022-11-10  发布在  Highcharts
关注(0)|答案(1)|浏览(214)

我希望图例文本的颜色与饼图中相应的切片颜色相同。我已经看到图例文本之前的点默认采用切片颜色的颜色,而不是图例文本的颜色。我们如何对图例文本执行相同的操作?
我已经从highcharts网站的演示链接下面钉。
https://www.highcharts.com/demo/pie-basic
我还附上了正在工作的截图。

例如,在此饼图中,我希望图例具有相应饼图部分的颜色

zte4gxcn

zte4gxcn1#

默认情况下,Highcharts不支持此功能,但您可以简单地添加它,例如使用以下插件:

(function(H) {
  H.wrap(H.Legend.prototype, 'renderItem', function(proceed, point) {
    proceed.apply(this, Array.prototype.slice.call(arguments, 1));

    point.legendItem.css({
      color: point.color
    });
  });
  // Handle hover and click event
  H.wrap(H.Point.prototype, 'setState', function(proceed) {
    proceed.apply(this, Array.prototype.slice.call(arguments, 1));

    this.legendItem.css({
      color: this.color
    });
  });
}(Highcharts));

现场演示:https://jsfiddle.net/BlackLabel/o4wyzbqt/
文件:https://www.highcharts.com/docs/extending-highcharts/extending-highcharts

相关问题