[Chartjs]-How to change background color in ng2-charts

7πŸ‘

βœ…

In my opinion, there is an option to do that by the colors property.
Just pass an array of colors objects (refer here to see the object)

here is a working example

Add the input in the HTML like that:

<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>

Then just add in your ts file the next object:

  public colors = [
    { backgroundColor:"red" },
    { backgroundColor:"green" },
    { backgroundColor:"blue" },
    { backgroundColor:"yellow" }
  ];

Leave a comment