Canvas clearRect() วิธี

คู่มือเกี่ยวกับ Canvas

คำนิยามและวิธีใช้

clearRect() วิธีลบพิกษุ์ที่กำหนดในกล่องสี่เหลี่ยม

ตัวอย่าง

ลบสี่เหลี่ยมที่กำหนดในกล่องสี่เหลี่ยม

เว็บเบราส์เคอร์ของคุณไม่สนับสนุนแท็ก HTML5 canvas.

JavaScript:

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.fillStyle="red";
ctx.fillRect(0,0,300,150);
ctx.clearRect(20,20,100,50);

ลองด้วยตัวเอง

วลี

context.clearRect(x,y,width,height);

ตัวแปรค่า

ตัวแปร รายละเอียด
x จำนวนรอบนอกที่จะลบที่มีตำแหน่ง x ของสุดบนซ้ายของรูปสี่เหลี่ยม
y จำนวนรอบนอกที่จะลบที่มีตำแหน่ง y ของสุดบนซ้ายของรูปสี่เหลี่ยม
width ความกว้างของสี่เหลี่ยมของที่ต้องการลบ หน่วยเป็นพิกเซล
height ความสูงของสี่เหลี่ยมของที่ต้องการลบ หน่วยเป็นพิกเซล

การสนับสนุนโปรแกรมบราวเซอร์

ตัวเลขในตารางระบุอุปกรณ์การเข้าถึงของเว็บบราวเซอร์ที่สนับสนุนคุณสมบัตินี้ทั้งหมดเป็นครั้งแรก

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
4.0 9.0 3.6 4.0 10.1

หมายเหตุ:Internet Explorer 8 และตัวเลือกที่เก่ากว่านี้ไม่สนับสนุนองค์ประกอบ <canvas> นี้

คู่มือเกี่ยวกับ Canvas