Przykład
Klip z prostokątnego obszaru 200*120 pikseli z płótna. Następnie narysować czerwony prostokąt. Tylko część czerwonego prostokąta, który jest wewnątrz przycięty obszar jest widoczny:
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> Spróbuj sam " Pomoc Browser
Liczby w tabeli określ pierwszą wersję przeglądarki, który w pełni obsługuje metodę.
| metoda | |||||
|---|---|---|---|---|---|
| clip() | tak | 9,0 | tak | tak | tak |
Definicja i Wykorzystanie
W clip() metoda klipów region dowolnym kształcie i rozmiarze z oryginalnego płótna.
Wskazówka: Gdy obszar jest obcięty, wszystkie przyszłe rysunek będzie ograniczona do ściętym regionu (brak dostępu do innych regionów na płótnie).Można jednak zapisać bieżący obszar roboczy za pomocą save() metodę przed użyciem clip() metody i przywrócić go (z restore() metody) w dowolnym momencie w przyszłości.
| Składnia JavaScript: | context.clip(); |
|---|