Последние учебники веб-разработки
 

HTML canvas clip() Method

<HTML Canvas Ссылка

пример

Клип прямоугольной области 200*120 пикселей с холста. Затем нарисуйте красный прямоугольник. Только часть красного прямоугольника, который находится внутри обрезанную область видна:

YourbrowserdoesnotsupporttheHTML5canvastag.

JavaScript:

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
// Clip a rectangular area
ctx.rect(50,20,200,120);
ctx.stroke();
ctx.clip();
// Draw red rectangle after clip()
ctx.fillStyle="red";
ctx.fillRect(0,0,150,100);
</script>
Попробуй сам "

Поддержка браузеров

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

метод
clip() да 9.0 да да да

Определение и использование

В clip() метод обрезает область любой формы и размера от первоначального холста.

Совет: После того, как регион обрезается, все будущее рисунок будет ограничено усеченную область (нет доступа к другим регионам на холсте).Однако вы можете сохранить текущую область холста с помощью save() метод перед использованием clip() метод, и восстановить его (с restore() метод) в любое время в будущем.

Синтаксис JavaScript: context.clip();

<HTML Canvas Ссылка