ChartJs - 饼图 - 如何删除饼图上的标签答案

【问题标题】：ChartJs - Pie Chart - how to remove labels that are on the pie chartChartJs - 饼图 - 如何删除饼图上的标签
【发布时间】：2019-04-24 16:58:27
【问题描述】：

我正在使用来自chart.js 的饼图在我的应用程序中进行可视化。我正在使用带有它的插件chartjs-plugin-piechart-outlabels 将标签显示为饼图中的外段。

一切正常，除了标签存在于饼图上，这是我不想要的，因为我将标签显示为外段。

我查看了文档，但找不到解决方案，还查看了一些示例。

public static readonly pieChartOptions: ChartOptions = {
responsive: true,
maintainAspectRatio: false,
legend: {
  display: false
},
tooltips: {
  enabled: true
},
layout: {
  padding: {
    left: 0,
    right: 0,
    top: 70,
    bottom: 0
  }
},
plugins: {
  outlabels: {
    display: true,
    borderWidth: 2,
    lineWidth: 2,
    padding: 3,
    textAlign: 'center',
    stretch: 15,
    font: {
      resizable: true,
      minSize: 12,
      maxSize: 18
    },
    valuePrecision: 1,
    percentPrecision: 2
  }
}

};

【问题讨论】：

你确定不使用chartjs-plugin-labels之类的其他插件吗？我问是因为 chartjs 默认情况下不会呈现这些标签
@yurzui 啊啊！我的错，你是对的，它在模块中被引用。我没有重新验证它！感谢您指出这一点。
@user1722043 这个插件还能用吗？ chartjs-plugin-piechart-outlabels

标签： angular chart.js chartjs-2.6.0

【解决方案1】：

您需要关闭示例标签，如下所示：

options: {
  plugins: {
    datalabels: {
      display: false
    }
    outlabels: {
      display: true
    }
  }
}

【讨论】：

这正是我想要的。谢谢！

【解决方案2】：

@yurzui 提到，我错过了删除 chartjs-plugin-labels 的引用。谢谢@yurzui

【讨论】：