Angularjs 在angular-chart.js圆环图上渲染图例

我遵循angular-chart.js文档，创建了一个图表，但无法用它呈现图例。我不明白为什么它不起作用

文档：
类似问题:

根据另一个SO问题中的公认答案，

chart legend=“true”

应足以使其正常工作

---

是否有人有使用此库的经验并知道如何解决此问题？

如果您使用的是基于chart.js 2的1.0.0-alpha分支，正确的语法是：

$scope.options = {legend: {display: true}};

在你的html中

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

---

我也遇到了类似的问题，所以我扩展了饼图的宽度，并将图例放在了图表的右侧，看起来很不错

您可以将其添加到控制器中

 $scope.options = {
    legend: {
      display: true,
      position: 'right'
    }
  };

在HTML中，您可以添加

<canvas id="pie" class="chart chart-pie" chart-data="data" chart-series="series" chart-labels="labels" chart-options="options" chart-colors="colors" chart-dataset-override="datasetOverride">
        chart-series="series"
      </canvas>

图表系列=“系列”

---

图例显示在顶部，并影响饼图的大小。有没有办法把它放在下面？是的，您可以在控制器中设置选项：$scope.options.legend.position：“bottom”；您可以在此处找到所有信息：

 $scope.options = {
    legend: {
      display: true,
      position: 'right'
    }
  };

<canvas id="pie" class="chart chart-pie" chart-data="data" chart-series="series" chart-labels="labels" chart-options="options" chart-colors="colors" chart-dataset-override="datasetOverride">
        chart-series="series"
      </canvas>