如何更改 ng2-charts 中的背景颜色

Nar*_*tty 1 chart.js ng2-charts angular

我正在使用 ng2-charts 绘制堆积条形图。但我无法更改条形图的默认背景颜色。

闪电战链接

试图将背景颜色属性添加到图表数据集,但它不起作用。

更新:工作演示:stackblitz

小智 7

在我看来,酒店可以选择这样做colors。只需传递一组颜色对象(请参阅此处查看对象

这是一个工作示例

像这样在 HTML 中添加输入:

<div style="display: block;">
   <canvas baseChart 
      [datasets]="barChartData"
      [labels]="barChartLabels"
      [options]="barChartOptions"
      [plugins]="barChartPlugins"
      [legend]="barChartLegend"
      [chartType]="barChartType"
      [colors]="colors">//<---------------the colors input property
   </canvas>
</div>
Run Code Online (Sandbox Code Playgroud)

然后只需在您的 ts 文件中添加下一个对象:

  public colors = [
    { backgroundColor:"red" },
    { backgroundColor:"green" },
    { backgroundColor:"blue" },
    { backgroundColor:"yellow" }
  ];
Run Code Online (Sandbox Code Playgroud)