Write text in donut chart center.

[jefhu]

I am trying to make a chart like above. Would you please advise how to approach?
What I am think is

1. Have a <canvas> next to the <p-chart> //p-chart is how Angular4+primeNG wraps chart.js
   <div class="dsbd-panel-body" style="position: relative; width:350px; height:300px;">
<canvas id="naples_text" style="z-index: -1; position: absolute; width:300px; height:300px; left: 0px; top: 0px;"></canvas>
   <p-chart type="doughnut" [data]="item.data" [options]="item.options" >
   </div>

2. Use Option.animation.onComplete() to write to the canvas
   `options: {
   ...
   },
   animation: {
   onComplete: function () {

        const mainLabel = numPercent;
        const $ = Utility.getJQuery();
        const element = $('#naples_text').get(0);
        if (element) {
          const textCtx = element.getContext('2d');
          textCtx.textAlign = 'center';
          textCtx.textBaseline = 'middle';
          textCtx.font = '24px Fira San';
          textCtx.fillStyle = '#676763';
          textCtx.fillText(mainLabel, 180, 70);
          textCtx.font = '10px Fira San';
          textCtx.fillStyle = '#e57553';
          textCtx.fillText(badLabel, 180, 95);
          textCtx.font = '12px Fira San';
          textCtx.fillStyle = '#88b358';
          textCtx.fillText(goodLabel, 180, 105);
        }
      }
    }
   

   }`

[simonbrunel]

It's not possible using this plugin but there are lot of solutions debated in chartjs/Chart.js#78. I would recommend you to ask implementation questions on stackoverflow instead and reserve GitHub issues for bug / generic feature requests.