диаграмма js Добавление процентов к P ie Легенда диаграммы - PullRequest
Новая
       3

диаграмма js Добавление процентов к P ie Легенда диаграммы

1 голос
/ 10 января 2020

Какой самый простой способ добавить процентные значения к надписям легенды?

Я полагаю, что он будет использовать generateLabels: function (chart) {}, кто-нибудь может привести чистый пример?

1 Ответ

0 голосов
/ 10 января 2020

Кажется, что нет никакого собственного способа показать проценты, но довольно просто рассчитать и установить их в качестве меток: 

const data = [1, 2, 3],
  // ref: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/Reduce
  total = data.reduce((accumulator, currentValue) => accumulator + currentValue),
  // ref: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map
  labels = data.map(value => Math.round((value / total) * 100) + '%');

new Chart(document.getElementById('chart'), {
  type: 'doughnut',
  data: {
    labels: labels,
    datasets: [{
      data: data
    }]
  }
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.3/Chart.min.js"></script>
<canvas id="chart" height="75"></canvas>

(Примечание: использование Math.round() может привести к тому, что определенные наборы чисел не будут равны 100% при суммировании.)

...