Canvas quadraticCurveTo() Metodu
Tanım ve Kullanım
quadraticCurveTo()
metodu kullanarak belirtilen kontrol noktasını içeren ikinci dereceden Bezier çizgisini mevcut yola ekleyin.
İpucu:İkinci dereceden Bezier çizgisi iki noktaya ihtiyaç duyar. İlk nokta, ikinci dereceden Bezier hesaplamasında kullanılan kontrol noktasıdır, ikinci nokta ise çizginin bitiş noktasıdır. Çizginin başlangıç noktası, mevcut yolda en son noktadır. Yol yoksa, lütfen beginPath() ve moveTo() metodu ile başlangıç noktasını tanımlayın.

- Başlangıç noktası: moveTo(
20
,20
) - Kontrol noktası: quadraticCurveTo(
20
,100
,200,20) - Bitiş noktası: quadraticCurveTo(20,100,
200
,20
)
İpucu:Bakınız bezierCurveTo() metoduBu, bir değil iki kontrol noktasına sahiptir.
Örnek
Bir ikinci dereceden Bezier çizgisi çizin:
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();
Sözdizimi
context.quadraticCurveTo(cpx,cpy,x,y);
Parametre değeri
Parametre | Açıklama |
---|---|
cpx | Bezier kontrol noktasının x koordinatı. |
cpy | Bezier kontrol noktasının y koordinatı. |
x | Bitiş noktasının x koordinatı. |
y | Bitiş noktasının y koordinatı. |
Tarayıcı desteği
Tablodeki rakamlar, bu özelliği tam destekleyen ilk tarayıcı sürümünü belirtmektedir.
Chrome | Edge | Firefox | Safari | Opera |
---|---|---|---|---|
Chrome | Edge | Firefox | Safari | Opera |
4.0 | 9.0 | 3.6 | 4.0 | 10.1 |
Açıklama:Internet Explorer 8 ve daha eski sürümler <canvas> ögesini desteklememektedir.