HTML 5 холст шрифта игнорируется - PullRequest
8 голосов
/ 28 июля 2010

Я пытаюсь записать некоторый текст в элемент canvas, но кажется, что введенные мной параметры шрифта полностью игнорируются.Независимо от того, на что я их изменяю, все получается одинаково, который я считаю стандартным разрешением 10 пикселей без засечек.Вот что у меня есть (эта функция работает под нагрузкой)

function start()
{
    canvas = document.getElementById('c');
    ctx = canvas.getContext('2d');
    ctx.fillStyle = "white";
    ctx.font = "12px monospace";
    ctx.textBaseline = "top";
}

Она не работает ни в Firefox, ни в Chrome.

Ответы [ 2 ]

16 голосов
/ 21 ноября 2012

Что это также может произойти, если вы сбросите размер холста.По крайней мере, сегодня я видел это в Chrome 23.

context.font = 'bold 20px arial';
canvas.width = 100;
canvas.height = 100;
console.log(context.font); // gives '10px sans-serif'
5 голосов
/ 28 июля 2010

Как оказалось, изменение ctx.font необходимо использовать в той же функции, что и fillText()

Это заставляет его работать как шарм.

EDIT

Как упоминал Рихтаур в своем комментарии, этот ответ неверен. Ваш контекст должен быть сохранен и восстановлен с использованием ctx.save() и ctx.restore(), поскольку в настоящее время он сбрасывается при повторном вызове canvas.getContext ('2d').

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...