strokeText()¶
Метод strokeText()
рисует (без заливки) на холсте текст. По умолчанию цвет текста черный.
Чтобы определить тип и размер шрифта, используется свойство font
. Чтобы установить другой цвет/градиент заливки, используется свойство fillStyle
.
Примечание: Параметр maxWidth
не поддерживается в Safari 5.1 и более ранних версиях.
Синтаксис¶
context.strokeText(text, x, y, maxWidth);
Параметры¶
text
- Определяет строку текста, которая будет написана на холсте
x
- Координата X начала вывода текста (относительно холста)
y
- Координата Y начала вывода текста (относительно холста)
maxWidth
- Необязательный параметр. Максимально разрешенная ширина текста в пикселях
Спецификация¶
Пример¶
Напишем "Hello world!" и "Big smile!" (с градиентом) используя strokeText():
JavaScript:
var c = document.getElementById('myCanvas')
var ctx = c.getContext('2d')
ctx.font = '20px Georgia'
ctx.strokeText('Hello World!', 10, 50)
ctx.font = '30px Verdana'
// Создаем градиент
var gradient = ctx.createLinearGradient(0, 0, c.width, 0)
gradient.addColorStop('0', 'magenta')
gradient.addColorStop('0.5', 'blue')
gradient.addColorStop('1.0', 'red')
// Заполним градиентом
ctx.strokeStyle = gradient
ctx.strokeText('Big smile!', 10, 90)
Ссылки¶
- Метод
strokeText()
MDN (рус.)