如何在angular-chart.js中为图例着色

Question

在angular-chart.js文档的this section中的最后一个示例显示了带有彩色图例的饼图/极坐标图示例。显然，这应该是我的答案，但是：

我将此代码用于我的前端（这与文档中的几乎相同）：

<canvas id="base" 
        class="chart-pie" 
        chart-type="type" 
        chart-data="data" 
        chart-labels="labels" 
        chart-legend="true">
</canvas>

我也使用了相同的数据和标签。但不幸的是，渲染图的图例由list-bullet-points和标签组成（参见附图）这种情况发生在我用这个库创建的所有图表中。 是否有人知道这种行为或（甚至更好）解决该问题的任何解决方案？

我正在使用angular / typescript并将DefinitelyTyped文件绑定到我的项目。

编辑：我不愿意自己定义任何颜色！图表本身就有自己的颜色。我们应该这样离开。

Answer 1

您似乎缺少对html文件中样式表的引用。 angular-chart.css

Answer 2

我做了以下事情：

$ git clone https://github.com/jtblin/angular-chart.js.git
$ npm install
$ bower install

然后打开angular-chart.js \ examples \ charts.html

更改

<canvas id="pie" class="chart chart-pie chart-xs" chart-data="data" chart-labels="labels"></canvas>

到

<canvas id="pie" class="chart chart-pie chart-xs" chart-data="data" chart-labels="labels" chart-legend="true"></canvas>

图表上有一个带颜色的图例。你的CSS似乎与正式发行的不同。