サイト内検索

clip() メソッド

実行結果

コード

/* 背景を黒で塗りつぶす */
ctx.beginPath();
ctx.rect(0, 0, 100, 100);
ctx.fillStyle = "rgb(0,0,0)";
ctx.fill();
/* 円形のクリッピングパスを生成 */
ctx.beginPath();
ctx.arc(50, 50, 45, 0, Math.PI * 2, false);
ctx.clip();
/* 写真を張る */
var img = new Image();
img.src = "../img/clip.png?" + new Date().getTime();
img.onload = function() {
  ctx.drawImage(img, 0, 0);
}