Chart.js在饼图上显示标签

Question

我最近更新了我的charts.js库到最新版本（2.5.0）。 此版本不显示图表上的标签。

我有一个在小提琴手上工作的例子：http://jsfiddle.net/g6fajwg8。

但是，我完全按照示例定义了我的图表，但仍然看不到图表上的标签。

注意：在Google和*上有很多类似的问题，但其中大部分都是关于以前的版本，对他们来说工作得很好。

var config = { 
    type: 'pie', 
    data: { 
     datasets: [{ 
      data: [ 
       1200, 
       1112, 
       533, 
       202, 
       105, 
      ], 
      backgroundColor: [ 
       "#F7464A", 
       "#46BFBD", 
       "#FDB45C", 
       "#949FB1", 
       "#4D5360", 
      ], 
      label: 'Dataset 1' 
     }], 
     labels: [ 
      "Red", 
      "Green", 
      "Yellow", 
      "Grey", 
      "Dark Grey" 
     ] 
    }, 
    options: { 
     responsive: true, 
     legend: { 
      position: 'top', 
     }, 
     title: { 
      display: true, 
      text: 'Chart.js Doughnut Chart' 
     }, 
     animation: { 
      animateScale: true, 
      animateRotate: true 
     } 
    } 
}; 

window.pPercentage = new Chart(ChartContext, config); 

Answer 1

好像没有这样的构建选项。

但是，这个选项有特殊的库，它调用：“Chart PieceLabel”。

这是他们的demo。

后您添加自己的脚本到你的项目，你可能需要添加另一种选择，叫：“pieceLabel”，和你喜欢的定义属性值：

pieceLabel: { 
    // mode 'label', 'value' or 'percentage', default is 'percentage' 
    mode: (!mode) ? 'value' : mode, 

    // precision for percentage, default is 0 
    precision: 0, 

    // font size, default is defaultFontSize 
    fontSize: 18, 

    // font color, default is '#fff' 
    fontColor: '#fff', 

    // font style, default is defaultFontStyle 
    fontStyle: 'bold', 

    // font family, default is defaultFontFamily 
    fontFamily: "'Helvetica Neue', 'Helvetica', 'Arial', sans-serif" 
}