HTML canvas quadraticCurveTo() na paraan
Definition at paggamit
quadraticCurveTo()
paraan upang magdagdag ng isang punto sa kasalukuyang paraan gamit ang tinukoy na kontrol na punto ng dalawang pangkat na kurba.
Paalala:Ang dalawang pangkat na kurba ay nangangailangan ng dalawang punto. Ang unang punto ay ang kontrol na punto sa dalawang pangkat na kurba, at ang ikalawang punto ay ang tapusin na punto ng kurba. Ang simulan na punto ng kurba ay ang huling punto sa kasalukuyang paraan. Kung walang paraan, gamitin ang beginPath() at moveTo() paraan upang tanggapin ang simulan na punto.

- Punto na simulan: moveTo(
20
,20
) - Kontrol na punto: quadraticCurveTo(
20
,100
,200,20) - Tapusin ang punto: quadraticCurveTo(20,100,
200
,20
)
Paalala:Gawin nang maari ang pagtingin: bezierCurveTo() na paraan。Mayroon itong dalawang kontrol na punto, hindi isa lamang.
Sample
Ihumapaw ang isang dalawang pangkat na kurba:
JavaScript:
var c=document.getElementById("myCanvas"); var ctx=c.getContext("2d"); ctx.beginPath(); ctx.moveTo(20,20); ctx.quadraticCurveTo(20,100,200,20); ctx.stroke();
รูปแบบ
context.quadraticCurveTo(cpx,cpy,x,y);
ค่าประกาย
ประกาย | คำอธิบาย |
---|---|
cpx | ตำแหน่ง x ของจุดควบคุมเบซีล |
cpy | ตำแหน่ง y ของจุดควบคุมเบซีล |
x | ตำแหน่ง x ของจุดสิ้นสุด |
y | ตำแหน่ง y ของจุดสิ้นสุด |
การสนับสนุนเบราเซอร์
ตัวเลขในตารางนี้ระบุว่าเวอร์ชั่นของเบราเซอร์ที่สนับสนุนคุณสมบัตินี้อย่างเต็มที่
Chrome | Edge | Firefox | Safari | Opera |
---|---|---|---|---|
Chrome | Edge | Firefox | Safari | Opera |
4.0 | 9.0 | 3.6 | 4.0 | 10.1 |
หมายเหตุ:Internet Explorer 8 และเวอร์ชั่นเก่ากว่าไม่สนับสนุนสิ่งกีดตัว <canvas>