Add number in the graphic center

2

I started to see the JS chart a short time ago, and I needed my donut shape chart to have the percentage of the first value in the middle of the chart, as it is in this image:

Inthecaseoftheexample,displaythevalueofPeterinthemiddle.

var randomScalingFactor = function() {
  return Math.round(Math.random() * 100);
};

var config = {
  type: 'doughnut',
  data: {
datasets: [{
  data: [
    33,        
    67,
  ],
  backgroundColor: [
    "#F7464A",
    "#46BFBD",        
  ],
  label: 'Expenditures'
}],
labels: [
  "Pedro: 33 ",
  "Henrique: 67 ",
]
  },
  options: {
responsive: true,
legend: {
  position: 'bottom',
},
title: {
  display: true,
  text: 'Pedro Henrique Kuzminskas Miyazaki de Souza'
},
animation: {
  animateScale: true,
  animateRotate: true
},
tooltips: {
  callbacks: {
    label: function(tooltipItem, data) {
    	var dataset = data.datasets[tooltipItem.datasetIndex];
      var total = dataset.data.reduce(function(previousValue, currentValue, currentIndex, array) {
        return previousValue + currentValue;
      });
      var currentValue = dataset.data[tooltipItem.index];
      var precentage = Math.floor(((currentValue/total) * 100)+0.5);         
      return precentage + "%";
    }
  }
}
  }
};


var ctx = document.getElementById("myChart").getContext("2d");
window.myDoughnut = new Chart(ctx, config); {

}
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.3.0/Chart.min.js"></script><canvasid="myChart" width="400" height="200"></canvas>
    
asked by anonymous 03.10.2016 / 21:51

0 answers