Canvas - композиция графики

При позиционировании изображений случается, что одно из них перекрывает, полностью или частично, другое. По умолчанию, изображение, выводимое позже, накладывается на изображения, выведенные скриптом ранее. Вместе с тем, можно установить различные типы композиции изображений, определяющие, какое изображение должно получиться в результате. Тип композиции задается свойством globalCompositeOperation, которое может принимать строковые значения:
"source-over" (по умолчанию), "source-in", "source-out", "source-atop", "destination-over", "destination-in", "destination-out", "destination-atop", "lighter", "darker", "copy", "xor".
Не все типы композиции интерпретируются различными браузерами одинаково. Ниже приводятся примеры, сгенерированные скриптом.Если бы не управление типом композиции, то круг должен быть сверху квадрата.