Рисование сложных фигур

Рисование сложных фигур

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

Как рисуются сложные контуры

Контуры сложных фигур рисуются в три этапа.

1. Web-обозреватель ставится в известность, что сейчас начнется рисование контура сложной фигуры.

2. Рисуются отдельные линии, прямые и кривые, составляющие сложный контур.

3. Web-обозреватель ставится в известность, что рисование контура закончено, и теперь фигура должна быть выведена на канву, возможно, с созданием заливки.

Также можно указать Web-обозревателю, что следует замкнуть нарисованный контур.

Рисование сложного контура начинается с вызова метода beginPath, который не принимает параметров и не возвращает результата.

Собственно рисование линий, составляющих сложный контур, выполняют особые методы, которые мы далее рассмотрим.

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

Завершает рисование контура вызов одного из двух методов: stroke или fill. Пер- вый метод просто завершает рисование контура, второй, помимо этого, замыкает контур, если он не замкнут, и рисует заливку получившейся фигуры. Оба метода не принимают параметров и не возвращают результата.

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