ng2-charts-条形图，仅显示一种颜色

Question

在Angular应用程序中，我正在使用ng2-charts，并尝试创建条形图。以下stackblitz运作良好，我正在追踪： https://stackblitz.com/edit/ng2-charts-bar-template 但是，在我的应用程序中，我正在从服务中获取数据，并为图表填充数据集。那行得通，但是有两个问题。

1. 它仅显示一种颜色，灰色。

2. 对于每个条形图，它使用标签的第一个日期值，即2019年4月，而为label：属性提供了所有相应的值。

尝试将值填充为纯javascript对象或键入对象（即Label和ChartDataSets），结果是相同的。

技术信息：

Angular CLI：8.0.4， 节点：11.12.0， 作业系统：win32 x64， 角度：8.0.2， ng2-charts@2.3.0， chart.js@2.8.0

module PaperTrail
  class Version < ::ActiveRecord::Base
     belongs_to :user, foreign_key: :whodunnit
  end
end

我希望条形图具有自动分配的颜色，而无需像stackblitz示例应用程序中已经手动分配的那样。

以下是图表中使用的数据：

以下是图表显示的方式：

Answer 1

删除模板中输入的颜色以自动生成颜色。如果具有[colors]输入，请确保input属性包含首选颜色。

选择的数据取决于您如何构造数据。它还取决于您要如何呈现和分组数据。例如，您已共享：

public barChartLabels: Label[] = ['2006', '2007', '2008', '2009', '2010', '2011', '2012'];
public barChartData: ChartDataSets[] = [
    { data: [65, 59, 80, 81, 56, 55, 40], label: 'Series A' },
    { data: [28, 48, 40, 19, 86, 27, 90], label: 'Series B' }
  ];

我相信您的数据结构应映射到相同的数据。