Текст, неотъемлемый атрибут графики, именно поэтому в canvas есть методы вывода текста. Рассмотрим код:
1 2 |
font='18px Arial'; // строкой задаем параметры текста strokeText ('Пример', 30,50);// выводим обведенный текст Пример и его координаты |
Выполнение данного кода:
See the Pen Canvas strokeText by Alex (@Asmodey) on CodePen.
Также можно задать текст залитый цветом:
1 |
fillText('Fill', 100,100); |
По-умолчанию цвет текста — черный, однако мы можем изменить цвет текста командой fillStyle=’red’.
See the Pen Canvas fillText by Alex (@Asmodey) on CodePen.
Выравнивание текста
Для выравнивания текста используется свойство textAlign:
1 |
ctx.textAlign = "center"; |