Чтение онлайн

на главную - закладки

Жанры

JavaScript. Подробное руководство, 6-е издание
Шрифт:

Подобно методу

Canvas.toDataURL,
этот метод препятствует утечке информации между доменами. Метод
getlmageData
возвращает объект
ImageData
, только если изображение в холсте имеет общее происхождение с документом; в противном случае он возбуждает исключение. Считается, что холст не имеет общего происхождения с документом, если в нем содержалось изображение (созданное непосредственно с помощью метода
drawlmage
или косвенно, с помощью объекта
CanvasPattern
), имеющее иное происхождение, отличное от происхождения содержащего его документа. Кроме того, считается, что элемент <canvas> имеет неясное происхождение, если в нем рисовался текст с использованием веб-шрифтов, имеющих иное происхождение.

boolean isPointInPath(double х, у)

Метод

isPointlnPath
возвращает true, если указанная точка попадает в пределы текущего контура; в противном случае он возвращает false. Указанные координаты интерпретируются в системе координат, не преобразованной с применением текущей матрицы преобразования. Аргумент х должен иметь значение между 0 и
canvas.width
, а аргумент у - между 0 и
canvas.height
.

Причина, почему

isPointlnPath
использует непреобразованные координаты, состоит в том, что он предназначен для «проверки попадания»: определения попадания указателя мыши во время щелчка (например) в область холста, ограниченную контуром. Чтобы выполнить проверку попадания, координаты указателя мыши сначала должны быть преобразованы из координат окна в координаты холста. Если экранные размеры холста отличаются от размеров, определяемых атрибутами
width
и
height
(например, в случае установки атрибутов
style.width
и
style.height
), координаты указателя мыши также необходимо привести к масштабу, соответствующему масштабу системы координат холста. Ниже демонстрируется функция, которая может использоваться как обработчик onclick элемента <canvas> и выполнять необходимые преобразования координат указателя мыши в координаты холста:

// Обработчик onclick для тега <canvas>. Предполагается, что текущий контур определен.

function hittest(event) {

var canvas = this; // Вызывается в контексте холста

var с = canvas.getContext("2d"); // Получить контекст рисования для холста

// Получить размеры и координаты холста var bb = canvas.getBoundingClientRect;

// Преобразовать координаты указателя мыши в координаты холста

var х = (event.clientX-bb.left)*(canvas.width/bb.width);

var у = (event.clientY-bb.top)*(canvas.height/bb.height);

// Залить контур, если пользователь щелкнул в его пределах

if (с.isPointInPath(x,у)) с.fill;

}

void lineTo(double x, double y)

Метод

lineTo
добавляет прямую линию в текущий подконтур. Линия начинается в текущей позиции пера и заканчивается в точке с координатами (х,у). Когда этот метод возвращает управление, текущая позиция перемещается в точку (х,у).

TextMetrics measureText(string text)

Метод

measureText
вычисляет ширину текста text, которую он займет при рисовании с текущим значением свойства
font
, и возвращает объект
TextMetrics
, содержащий результаты вычислений. На момент написания этих строк возвращаемый объект имел только одно свойство,
width
, а высота текста и параметры описывающего прямоугольника не вычислялись.

void moveTo(double х, double у)

Метод

moveTo
переносит текущую позицию пера в точку (х,у) и создает новый подконтур с начальной точкой в этой точке. Если перед этим существовал подконтур, состоящий из единственной точки, этот пустой подконтур удаляется из текущего контура.

void putImageData(ImageData imagedata, double dxt dy, [sx, sy, sw, sh])

Метод

putImageData
копирует прямоугольную область из объекта
ImageData
в холст. Он выполняет низкоуровневую операцию копирования пикселов, игнорируя значения свойств
globalCompositeOperation
и
globalAlpha
, а также область отсечки, матрицу преобразования и атрибуты, управляющие отображением тени.

Аргументы dx и dy определяют координаты назначения в холсте. Пикселы из объекта в аргументе

imagedata
будут копироваться в холст, начиная с этой точки. Значения этих аргументов не подвергаются преобразованию с применением текущей матрицы преобразования.

Последние четыре аргумента определяют исходную прямоугольную область в объекте

ImageData
. Скопированы будут только пикселы из указанной прямоугольной области. Если эти аргументы отсутствуют, объект
ImageData
будет скопирован целиком. Если эти аргументы определяют прямоугольник, выходящий за границы объекта
ImageData
, прямоугольник будет обрезан по этим границам. В аргументах sx и sy допускается передавать отрицательные значения.

Одна из ролей объектов

ImageData
– служить «временным хранилищем» для содержимого холста. Сохранение копии холста (с использованием метода
getImageData)
позволяет временно наносить на холст изображения и затем восстанавливать прежнее состояние холста с помощью
putlmageData.

void quadraticCurveTo(double срх, еру, х, у)

Данный метод добавляет кривую Безье второго порядка в текущий подконтур. Начальная точка кривой находится в текущей позиции, а координаты конечной точки определяются аргументами х и у. Форма кривой Безье, соединяющей эти две точки, определяется контрольной точкой (срХ, cpY). По возвращении из метода текущей позицией становится точка (х,у). Обратите также внимание на метод

bezierCurveTo.

void rect(double х, у, tv, h)

Добавляет в контур прямоугольник. Прямоугольник представляет собой отдельный подконтур, который никак не связан ни с одним из имеющихся подконтуров. По возвращении из метода текущей позицией становится точка (х,у). Вызов этого метода эквивалентен следующей последовательности вызовов:

с.moveTo(x,у);

с.lineTo(x+w, у);

с.lineTo(x+w, y+h);

Поделиться:
Популярные книги

Я еще князь. Книга XX

Дрейк Сириус
20. Дорогой барон!
Фантастика:
юмористическое фэнтези
попаданцы
аниме
5.00
рейтинг книги
Я еще князь. Книга XX

Легат

Прокофьев Роман Юрьевич
6. Стеллар
Фантастика:
боевая фантастика
рпг
6.73
рейтинг книги
Легат

Младший сын

Балашов Дмитрий Михайлович
1. Государи московские
Научно-образовательная:
история
8.50
рейтинг книги
Младший сын

Запечатанный во тьме. Том 2

NikL
2. Хроники Арнея
Фантастика:
уся
эпическая фантастика
фэнтези
5.00
рейтинг книги
Запечатанный во тьме. Том 2

Барон нарушает правила

Ренгач Евгений
3. Закон сильного
Фантастика:
фэнтези
попаданцы
аниме
5.00
рейтинг книги
Барон нарушает правила

Кодекс Охотника. Книга IV

Винокуров Юрий
4. Кодекс Охотника
Фантастика:
фэнтези
попаданцы
аниме
5.00
рейтинг книги
Кодекс Охотника. Книга IV

Око василиска

Кас Маркус
2. Артефактор
Фантастика:
городское фэнтези
попаданцы
аниме
5.00
рейтинг книги
Око василиска

Казань

Вязовский Алексей
2. Русский бунт
Фантастика:
альтернативная история
4.50
рейтинг книги
Казань

Курс 1. Октябрь

Фокс Гарри
2. Маркатис
Фантастика:
аниме
фэнтези
сказочная фантастика
5.00
рейтинг книги
Курс 1. Октябрь

Проданная Истинная. Месть по-драконьи

Белова Екатерина
Любовные романы:
любовно-фантастические романы
5.00
рейтинг книги
Проданная Истинная. Месть по-драконьи

Черный рынок

Вайс Александр
6. Фронтир
Фантастика:
боевая фантастика
космическая фантастика
космоопера
5.00
рейтинг книги
Черный рынок

Я уже царь. Книга XXIX

Дрейк Сириус
29. Дорогой барон!
Фантастика:
юмористическое фэнтези
аниме
попаданцы
5.00
рейтинг книги
Я уже царь. Книга XXIX

Бандит 2

Щепетнов Евгений Владимирович
2. Петр Синельников
Фантастика:
боевая фантастика
5.73
рейтинг книги
Бандит 2

Запечатанный во тьме. Том 1. Тысячи лет кача

NikL
1. Хроники Арнея
Фантастика:
уся
эпическая фантастика
фэнтези
5.00
рейтинг книги
Запечатанный во тьме. Том 1. Тысячи лет кача