[Chartjs]-Add Text to Doughnut Chart – ChartJS

by

4👍

✅

I’ve tried to append text to the center

You’re appending elements inside of the canvas tag. That’s only displayed as a fallback when your browser lacks canvas support.

What you’re looking for is using the canvas getContext method.

Jsfiddle example

Adapted to what you provided, it would go something like this:

var centerX = chart.width / 2;
var centerY = chart.height / 2;

chart.fillStyle = 'black';
chart.font = '200px';
chart.textAlign = 'center';
chart.fillText(selector, centerX, centerY);

You may need to offset centerX or centerY depending on how the width of your doughnut charts is calculated.

Leave a comment