Chart.js Показать метки на круговой диаграмме

Question

Недавно я обновил свою библиотеку charts.js до самой обновленной версии (2.5.0). Эта версия не отображает метки на диаграмме.

У меня есть пример работы на скрипаче: http://jsfiddle.net/g6fajwg8.

Однако я определил свою диаграмму точно так же, как в примере, но все еще не вижу метки на диаграмме.

Примечание. В Google и Stackoverflow есть много вопросов, но большинство из них касается предыдущих версий, которые хорошо работают на них.

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" 
}