例
キャンバスから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() |
|---|
<Canvasオブジェクト