Doughnut: write something in the center

Hi,

I’m not very familiar with the canvas , I’d like to write something in the center of the doughnut and I’ve tried to use the ctx.fillText() without success, once I call the chartjs API it erases my text, and if I try to fillText after the call it output nothing.

I’d like to achieve something similar to this:

Am I doing something wrong with my try or is just no way to do it using chartjs?

Thanks

[corentingi]

You can easily achieve this now with plugins:

var chart = new Chart(ctx, {
  plugins: [{
    id: 'my-plugin',
    afterDraw: function (chart, option) {
      chart.ctx.fillStyle = 'black'
      chart.ctx.textBaseline = 'middle'
      chart.ctx.textAlign = 'center'
      chart.ctx.font = '17px Arial'
      chart.ctx.fillText('50%', chart.canvas.width / 2, chart.canvas.height / 2)
    }
  }]
});

You can have more info on this there: http://www.chartjs.org/docs/latest/developers/plugins.html#using-plugins

[dunckr]

This worked for me by revising this

    Chart.types.Doughnut.extend({
        name: "DoughnutAlt",
        draw: function() {
            Chart.types.Doughnut.prototype.draw.apply(this, arguments);
            this.chart.ctx.fillStyle = 'black';
            this.chart.ctx.textBaseline = 'middle';
            this.chart.ctx.fillText(this.segments[0].value + "%", this.chart.width / 2 - 20, this.chart.width / 2, 200);
        }
    });