как разместить текст в центре половины диаграммы пончика на графике js

Question

Я хочу добавить текст в центр полусладкой диаграммы, это мой код:

HTML:

  <div class="chart-container" >
      <canvas id="half_donut"></canvas>
  </div>

js file:

     var chartColors = {
      half_donut: '#fba66c',
      themecolor:  '#62c799'
      };


var myChart = new Chart('half_donut', {
type: 'doughnut',
data: {
    labels: ['half_donut'],
    datasets: [{
        label: 'half_donut',
        data: [25, 45],
        backgroundColor: [chartColors.half_donut, chartColors.themecolor],
        borderColor: [chartColors.half_donut, chartColors.themecolor],
        borderWidth: 1
    }]
},
options: {
    responsive:true,
    circumference: Math.PI,
    rotation:Math.PI,
    cutoutPercentage:60,
    title: {
        display: true,
        text: '50' ,
        position: 'bottom',
        verticalAlign: 'middle',
        align: 'center',
        y: 20,
     },
    legend: {
        position: 'top'
    },
    tooltips: {
        enabled: false
   },
    animation: {
        animateScale: true,
        animateRotate: true
    },
}
});

мой текущий график выглядит так:

ожидаемый результат:

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