Содержание
Мы разобрались, как рисовать заполненные или каркасные прямоугольники. Как только вызывается метод ctx.strokeRect (x, y, width, height) или ctx.fillRect (x, y, width, height), прямоугольник действительно рисуется на холсте немедленно. При рисовании прямоугольников с помощью strokeRect или fillRect, рисовании текста или рисунков, все эти фигуры будут отображаться сразу, что и называется «режим немедленного рисования«.
Другой режим, называемый «режим пути» («path mode«), или «режим с буферизацией», будет рассмотрен в следующей статье. С его помощью рисуются линии, кривые, дуги, а также прямоугольники.
Прямоугольники — это единственные фигуры, у которых есть режим немедленного рисования, и «режим пути/буферизации» («path/buffered mode«).
Таким образом, режим немедленного рисования — это графический контекст canvas HTML5 предоставляет несколько методов рисования. При вызове этих методов рисунки появляются на холсте, как только выполняются инструкции.
Рисование текста
API Canvas предоставляет два основных метода для рисования текста:
-
- ctx.strokeText (message, x, y);
- ctx.fillText (message, x, y) .
Он также предоставляет набор свойств контекста для установки шрифта и стиля символа, для разметки текста и т. д.
Типичное использование
Нарисуем текст «Hello, World!»: