Преглед садржаја
Приликом коришћења предмета платно за цртање нисмо ограничени на цртање правоугаоних фигура, можемо цртати и помоћу координата и тзв стазе које су путање којима ћемо означити елемент платно где и како приказати наш цртеж.Могућности које нам ово пружа су импресивне, јер са потребним алгоритмима можемо направити неограничене композиције, нацртати било коју врсту фигуре у ХТМЛ5 а са њим до постизања заједно са другим елементима резултата који се никада нису могли замислити у претходним спецификацијама језика.
Коришћење путање
Као што смо поменули пут то је оно што ће нам омогућити да на платну назначимо координате помоћу којих би цртеж требало да буде направљен, са овим координатама платно ће моћи да зна где да нацрта одговарајуће линије и на крају са правилном акумулацијом линија можемо постићи било које врста фигуре.
Пре него што пређемо на одговарајуће примере, морамо знати које су методе доступне за елемент платна и путању, погледајмо следећу листу:
- бегинПатх (): Ова метода нам омогућава да започнемо нови пут.
- цлосеПатх (): Ова метода покушава да затвори тренутну путању повлачењем линије од краја последње линије до почетних координата.
- филл (): Попуните обрасце описане подпутовима.
- исПоинтИнПатх (к, и): Враћа труе ако је наведена тачка садржана у облику исцртаном тренутном путањом.
- линеТо (к, и): Нацртајте подпуту на наведеним координатама.
- мовеТо (к, и): Омогућава нам да пређемо на наведене координате без потребе за цртањем под-путање.
- рецт (к, и, в, х): Нацртајте правоугаоник чије координате у горњем левом углу одговарају (к, и) његова ширина одговара в, а висина х.
- удар (): Нацртајте спољне линије облика исцртаних подпутом.
• Метод називамо бегинПатх.
• Методом прелазимо на почетну позицију померити у.
• Подцртавамо методе помоћу метода линеТоитд.
• Опционо можемо позвати методу цлосеПатх.
• На крају позивамо методе испунити или стоке.
Већ имамо препоручени редослед за почетак цртања, сада видимо одговарајући код у ХТМЛ5.
Пример Ваш прегледач не подржава елемент платно
Као што видимо, два су позива упућена бегинПатх(), са овим можемо започети области за цртање на платну, а затим помоћу мовеТо () успостављамо почетне позиције, а остало је цртање.
Хајде да видимо како наш цртеж изгледа у прегледачу: