, которое является константой). Матрица преобразования и область отсечки также сохраняются на стеке, но текущий контур и позиция пера не сохраняются.
Манипулирование пикселами
Метод
getlmageData
позволяет получить массив пикселов холста, а метод putlmageData дает возможность устанавливать отдельные пикселы. Эти методы могут пригодиться, если потребуется реализовать обработку изображений на языке JavaScript.
Свойства
readonly Canvas canvas
Элемент
Canvas
,
который будет использоваться для создания изображения,
any fillStyle
Текущий цвет, шаблон или градиент, используемый для заполнения. Это свойство может принимать строковое значение либо объект
CanvasGradient
или
CanvasPattern
. По умолчанию заливка выполняется сплошным черным цветом
string font
Шрифт, используемый методами рисования текста. Для определения значения этого свойства используется тот же синтаксис, что и при определении значения CSS-атрибута
font
. Значение по умолчанию: «10рх sans-serif». Если размер шрифта в строке указан в таких единицах, как «еm» или «ех», или используются ключевые слова, определяющие относительные значения, такие как «larger», «smaller», «bolder» или «lighter», они интерпретируются относительно вычисленного CSS-стиля шрифта элемента
<canvas>.
double globalAlpha
Определяет дополнительный уровень прозрачности, который будет добавляться ко всему, что будет нарисовано на холсте. Значение альфа-компонента всех пикселов, рисуемых на холсте, будет умножаться на значение этого свойства. Диапазон значений от 0.0 (полностью прозрачный) до 1.0 (значение по умолчанию: не добавляет дополнительную прозрачность).
string globalCompositeOperation
Определяет порядок смешения («композиции») цветов на холсте. Обычно это свойство бывает полезным только при работе с полупрозрачными цветами или когда изменяется значение свойства
globalAlpha
. Значение по умолчанию: «source-over». Также часто используются значения «destination-over» и «сору». Перечень допустимых значений приводится в таблице выше. Обратите внимание, что на момент написания этих строк броузеры по-разному выполняли некоторые виды композиции: некоторые выполняли композицию локально, а некоторые - глобально. Подробности приводятся в разделе 21.4.13.
string linеСар
Определяет, как должны оканчиваться отображаемые линии. Устанавливать это свойство имеет смысл только при рисовании толстых линий. Допустимые значения перечислены в следующей таблице. Значение по умолчанию: «butt».
string lineJoin
Когда контур включает вершины, где соединяются прямые линии и/или кривые, свойство
lineJoin
определяет, как должны рисоваться эти вершины. Действие этого свойства проявляется только при рисовании толстых линий.
Значение
по умолчанию, «miter», указывает, что внешние края двух линий в точке сопряжения должны быть продолжены, пока они не пересекутся. Когда две линии сопрягаются под очень острым углом, область сопряжения может оказаться достаточно длинной. Ограничить максимальную длину такого варианта сопряжения можно с помощью свойства
miterLimit
. Когда длина сопряжения превышает этот предел, сопряжение просто усекается.
Значение «round» указывает, что внешние края линий, образующих вершину, должны сопрягаться закрашенной дугой, диаметр которой равен толщине линий. Значение «bevel» указывает, что внешние края линий, образующих вершину, должны сопрягаться закрашенным треугольником,
double lineWidth
Определяет толщину линий для операций рисования. Значение по умолчанию - 1. Широкие линии центрируются по воображаемой линии контура на половину толщины в одну сторону и на половину толщины в другую,
double miterLimit
Когда линии сопрягаются под очень острым углом и при этом свойство
lineJoin
установлено в значение «miter», область сопряжения может оказаться достаточно длинной. Слишком длинная область сопряжения может выглядеть достаточно некрасиво. Свойство
miterLimit
позволяет определить максимальную длину сопряжения. Величина этого свойства выражает отношение длины области сопряжения к толщине линий. Значение по умолчанию - 10, оно означает, что область сопряжения по длине никогда не должна превышать толщину линий более чем в 5 раз. Когда длина сопряжения превышает этот предел, оно просто усекается,
double shadowBlur
Определяет степень размытия краев тени. Значение по умолчанию - 0; при этом тень воспроизводится с резкими краями. Чем больше значение, тем более размытый край тени получается. Имейте в виду, что это значение измеряется не в пикселах и не подвержено действию текущего преобразования системы координат,
string shadowColor
Определяет цвет тени в формате CSS. По умолчанию используется черный прозрачный цвет,
double shadowOffsetX
double shadowOffsetY
Определяют горизонтальное и вертикальное смещение теней. Чем больше смещение, тем выше объект с тенью кажется расположенным над фоном. Значение по умолчанию: 0. Эти значения измеряются в единицах системы координат и не зависят от текущего преобразования,
any strokeStyle
Определяет цвет, шаблон или градиент, используемый для рисования контуров. Это свойство может принимать строку с обозначением цвета в формате CSS либо объект
CanvasGradient
или
CanvasPattern
.
string textAlign
Определяет выравнивание текста по горизонтали относительно координаты X, передаваемой методам
fillText
и
strokeText.
Допустимыми значениями являются «left», «center», «right», «start» и «end». Смысл значений «start» и «end» зависит от атрибута