пример
Клип прямоугольной области 200 * 120 пикселей из холста. Затем, нарисуйте красный прямоугольник. Только часть красного прямоугольника, который находится внутри подстриженных областей видна:
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() | 4,0 | 9,0 | 3,6 | 4,0 | 10,1 |
Определение и использование
В clip() метод клипы область любой формы и размера от первоначального холста.
Tip: После того, как регион обрезается, все будущее рисунок будет ограничено обрезанный региона (no access to other regions on the canvas) . Однако вы можете сохранить текущую область холста с помощью save() метода перед использованием clip() метода, и восстановить его (with the restore() методом) в любое время в будущем.
| Синтаксис JavaScript: | context . clip() ; |
|---|
<Холст объекта