如何修改离子2中的图表，如下图所示？

Question

I am using import {Chart} from 'chart.js'; to create my chat but I have some challenges. I want to create a chart like the one shown below.

Best Regards

//Creating the doughth
    this.doughnutChart = new Chart(this.doughnutCanvas.nativeElement, {


      type: 'doughnut',
      data: {
        labels: ["Cash in Hand", "Cash in Bank", "Cash in Mpesa"],
        datasets: [{
          label: '# of Votes',
          data: [this.naaam, this.naaam1, this.naaam2 ],
          backgroundColor: [
            'rgba(255, 99, 132, 0.2)',
            'rgba(54, 162, 235, 0.2)',
            'rgba(255, 159, 64, 0.2)'
          ],
          hoverBackgroundColor: [
            "#FF6384",
            "#36A2EB",
            "#FFCE56"
          ]
        }]
      }

    });

Answer 1

We're also using Chart.js in our Ionic 2 app. For rendering the charts we use the ng2-charts library.

With regards to your question about putting the total in the bottom center, you can just wrap your chart in a div and add an absolutely positioned span element containing the total.