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

Как отмечалось выше, начало системы координат холста по умолчанию находится в левом верхнем углу, значение координаты X увеличивается в направлении слева направо, а координаты Y - сверху вниз. В этой системе координат по умолчанию координаты точки отображаются непосредственно в CSS-пикселы (которые затем отображаются в один или более аппаратных пикселов). Некоторые операции с холстом и атрибутами (такие как извлечение параметров пикселов и установка смещения теней) всегда используют систему координат по умолчанию. Однако помимо системы координат по умолчанию каждый холст имеет в составе графических свойств «текущую матрицу преобразований». Эта матрица определяет текущую систему координат холста. В большинстве операций с холстом, где указываются координаты точки, используется текущая система координат, а не система координат по умолчанию. Текущая матрица преобразований используется для преобразования указанных вами координат в эквивалентные им координаты в системе координат по умолчанию.

Метод

позволяет напрямую определять матрицу преобразований холста, но обычно преобразования системы координат проще определять как последовательность операций смещения, вращения и масштабирования. Влияние этих операций на систему координат холста иллюстрируются на рис. 21.7. Программа, с помощью которой был получен этот рисунок, семь раз подряд использовала одно и то же изображение осей координат. Единственное, что изменялось каждый раз, - это текущее преобразование. Обратите внимание, что преобразования оказывают влияние не только на рисование линий, но и на вывод текста.

Метод

просто смещает начало системы координат влево, вправо, вверх или вниз. Метод выполняет вращение осей координат по часовой стрелке на указанный угол. (Прикладной интерфейс объекта всегда измеряет углы в радианах. Чтобы преобразовать градусы в радианы, необходимо разделить значение в градусах на 180 и умножить на .) Метод растягивает или сжимает расстояния по оси X или Y.

Передача отрицательного коэффициента масштабирования методу

переворачивает соответствующую ему ось относительно начала системы координат, создавая зеркальное ее отражение. Именно это преобразование можно наблюдать внизу слева на рис. 21.7: вызов метода сместил начало координат в левый нижний угол холста, а вызов метода перевернул ось Y так, что значения координаты Y стали увеличиваться в направлении снизу вверх. Такая перевернутая система координат должна быть знакома вам по школьному курсу алгебры, и она может пригодиться для рисования графиков и диаграмм. Отметьте, однако, что текст после такого преобразования очень трудно читать!

На мой взгляд, проще всего разбираться с преобразованиями, имея их геометрическое представление, когда действие методов

и можнo представить в виде преобразований координатных осей, как показано на рис. 21.7. Преобразования можно также представить алгебраически, в виде системы уравнений, отображающих координаты точки (х,у) в преобразованной системе координат в координаты той же точки (х',у') в исходной системе координат.

Вызов метода

можно описать следующими уравнениями:

Операцию масштабирования также можно представить в виде простых уравнений. Вызов метода

можно описать следующим образом:

Операция вращения выглядит несколько сложнее. Вызов

описывается следующими тригонометрическими уравнениями:

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

Если же к исходной системе координат сначала применялся метод

, а затем мы придем к другой системе уравнений:

При использовании алгебраических представлений последовательностей преобразований важно помнить, что в уравнениях они должны следовать в обратном порядке - от последнего преобразования к первому. Однако при использовании геометрических представлений вы работаете с последовательностями преобразований в прямом порядке, от первого к последнему.

Преобразования, поддерживаемые холстом, известны как аффинные преобразования. Аффинные преобразования могут изменять расстояния между точками и углы между линиями, но параллельные линии всегда остаются параллельными после любых аффинных преобразований - с помощью аффинных преобразований нельзя, например, создать эффект искажения типа «рыбий глаз». Любое аффинное преобразование можно описать с помощью шести параметров от а до f, как показано в следующих уравнениях:

К текущей системе координат можно применять любые преобразования, передавая эти шесть параметров методу

. На рис. 21.7 показаны два типа преобразований - сдвиг и вращение вокруг указанной точки - которые можно реализовать с помощью метода , как показано ниже: