angular - 如何更改 ng2-charts 的颜色？

Question

我已将 ng2-charts 添加到我的项目并显示 2 个图表 - 圆环图和条形图。两者都显示为灰色因为我添加了

    <base-chart class="chart"
                [colors]="chartColors"
                ...
    </base-chart> 

到component.template.html，和

public chartColors:Array<any> =[
    {
      fillColor:'rgba(225,10,24,0.2)',
      strokeColor:'rgba(11,255,20,1)',
      pointColor:'rgba(111,200,200,1)',
      pointStrokeColor:'#fff',
      pointHighlightFill:'#fff',
      pointHighlightStroke:'rgba(200,100,10,0.8)'
    }, ... (3x)

到 component.ts。

是否需要导入任何其他包来更改颜色或设置是否错误？

Chrome html 检查器显示以下呈现的 html 输出:

ng-reflect-colors="[object Object],[object Object],[object Object]"

Answer 1

你也可以这样做:

<base-chart class="chart"
            [colors]="chartColors"
            ...
</base-chart>

和

public chartColors: any[] = [
      { 
        backgroundColor:["#FF7360", "#6FC8CE", "#FAFFF2", "#FFFCC4", "#B9E8E0"] 
      }];