пример
Клип прямоугольной области 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() | да | 9.0 | да | да | да |
Определение и использование
В clip() метод обрезает область любой формы и размера от первоначального холста.
Совет: После того, как регион обрезается, все будущее рисунок будет ограничено усеченную область (нет доступа к другим регионам на холсте).Однако вы можете сохранить текущую область холста с помощью save() метод перед использованием clip() метод, и восстановить его (с restore() метод) в любое время в будущем.
Синтаксис JavaScript: | context.clip(); |
---|