tutorial pengembangan web terbaru
 

HTML canvas quadraticCurveTo() Method

<HTML Canvas Referensi

Contoh

Menggambar kurva Bezier kuadrat:

YourbrowserdoesnotsupporttheHTML5canvastag.

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();
Cobalah sendiri "

Dukungan Browser

Angka-angka dalam tabel menentukan versi browser pertama yang sepenuhnya mendukung metode ini.

metode
quadraticCurveTo() iya nih 9.0 iya nih iya nih iya nih

Definisi dan Penggunaan

The quadraticCurveTo() metode menambahkan titik ke jalan saat ini dengan menggunakan titik kontrol tertentu yang mewakili kurva Bezier kuadrat.

Kurva Bezier kuadrat membutuhkan dua poin. Titik pertama adalah titik kontrol yang digunakan dalam perhitungan Bezier kuadrat dan titik kedua adalah titik akhir untuk kurva. Titik awal untuk kurva adalah titik terakhir di jalan saat. Jika jalan tidak ada, gunakan beginPath() dan moveTo() metode untuk menentukan titik awal.

Kurva Bezier kuadrat

Titik awal:
moveTo (20,20)
Titik kontrol:
quadraticCurveTo (20.100, 200,20)
Titik akhir:
quadraticCurveTo (20.100, 200,20)

Tip: Check out bezierCurveTo() metode.Ini memiliki dua kontrol-poin bukan satu.


sintaks JavaScript: context.quadraticCurveTo(cpx,cpy,x,y);

Nilai parameter

Parameter Deskripsi Mainkan
cpx X-koordinat titik kontrol Bezier Mainkan "
cpy Y-koordinat titik kontrol Bezier Mainkan "
x X-koordinat titik akhir Mainkan "
y Y-koordinat titik akhir Mainkan "

<HTML Canvas Referensi