Жирный текст внутри кольцевой диаграммы (chart.js)

Question

Я пытаюсь установить полужирный текст внутри моей кольцевой диаграммы (используя chart.js)

И приведенный ниже код работает хорошо, но -fontStyle и fontWeight-они не работаютвообще.

Как изменить текст в центре жирным шрифтом?

let ctx = chart.chart.ctx;

ctx.textAlign = 'center';
ctx.textBaseline = 'middle';
ctx.font = '3vh Montserrat';
ctx.fontStyle = 'bold';  // not working!
ctx.fontWeight = '900';  // not working!

http://jsfiddle.net/wh5kcqzy/3/

Answer 1

Плз см. Свойство шрифта HTML canvas.

Синтаксис JavaScript: context.font = "курсив, маленькие буквы, полужирный 12px arial";

Ссылка: https://www.w3schools.com/tags/canvas_font.asp

В вашем случае просто замените:

let ctx           =   chart.chart.ctx;
let fontSize      =   (height / 100).toFixed(2);

ctx.textAlign     =   'center';
ctx.textBaseline  =   'middle';
ctx.font          =   "bold " + fontSize + "em Montserrat";