HTML canvas quadraticCurveTo() Method

Example

let c = document.getElementById("myCanvas");
let ctx = c.getContext("2d");

ctx.beginPath();
ctx.moveTo(25, 25);
ctx.quadraticCurveTo(25, 200, 125, 25);
ctx.stroke();

Try this code ❯

Meaning

The quadraticCurveTo() method creates a quadratic Bézier curve.

Standard Syntax

JavaScript syntax:

context.quadraticCurveTo(cpx,cpy,x,y);

Parameter Values

Parameter	Description
cpx	Specifies the x-coordinate of the Bézier control point.
cpy	Specifies the y-coordinate of the Bézier control point.
x	Specifies the x-coordinate of the ending point.
y	Specifies the y-coordinate of the ending point.