Контекст рисования

 

Рисование на канве выполняется с помощью особых свойств и методов объекта… нет, не HTMLCanvasElement, а CanvasRenderingContext2D. Этот объект представляет так называемый контекст рисования , который можно рассматривать как набор инструментов, используемый для рисования на данной канве.

Значит, перед тем как начать рисование, нам придется как-то получить экземпляр объекта Web-обозревателя CanvasRenderingContext2D для данной канвы. Это выполняется вызовом единственного метода getContext объекта HTMLCanvasElement:

<канва> .getContext("2d")

Мы видим, что метод getContext принимает единственный параметр — строку "2d". Возвращает он то, что нам нужно, — экземпляр объекта CanvasRenderingContext2D, представляющий контекст рисования данной канвы.

Напишем небольшой Web-сценарий, который помещает в переменную ctxCanvas контекст рисования для ранее созданной канвы cnv:

var htelCanvas = Ext.getDom("cnv");

var ctxCanvas = htelCanvas.getContext("2d");

Впоследствии мы будем пользоваться этим контекстом рисования для наших примеров.

Вот теперь, вооружившись контекстом рисования канвы, мы можем начать рисовать на ней с помощью весьма многочисленных свойств и методов объекта CanvasRenderingContext2D, которые мы обязательно рассмотрим.

 

ВНИМАНИЕ!

Все свойства и методы, рассматриваемые далее, принадлежат объекту CanvasRenderingContext2D, если об этом не сказано специально.

 

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

 








Дата добавления: 2015-05-08; просмотров: 815;


Поиск по сайту:

При помощи поиска вы сможете найти нужную вам информацию.

Поделитесь с друзьями:

Если вам перенёс пользу информационный материал, или помог в учебе – поделитесь этим сайтом с друзьями и знакомыми.
helpiks.org - Хелпикс.Орг - 2014-2024 год. Материал сайта представляется для ознакомительного и учебного использования. | Поддержка
Генерация страницы за: 0.005 сек.