例
绘制二次贝塞尔曲线：
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(); 试一试» 浏览器支持
在表中的数字指定完全支持方法的第一个浏览器的版本。
| 方法 | |||||
|---|---|---|---|---|---|
| quadraticCurveTo() | 是 | 9 | 是 | 是 | 是 |
定义和用法
该quadraticCurveTo()方法使用表示二次贝塞尔曲线指定的控制点，增加了一个点到当前路径。
二次贝塞尔曲线，需要两个点。 第一点是在二次贝塞尔用于计算和第二点是对于曲线的结束点的控制点。 对于曲线的起点是在所述电流通路中的最后一个点。 如果一路径不存在，则使用beginPath()和moveTo()方法来定义的起始点。
起点：
的moveTo（20,20） 控制点：
到quadraticCurveTo（20,100，200,20） 终点：
到quadraticCurveTo（20,100，200,20） 提示：退房bezierCurveTo()方法。它有两个控制点而不是一个。
| JavaScript语法： | context.quadraticCurveTo(cpx,cpy,x,y); |
|---|
参数值
| 参数 | 描述 | 播放 |
|---|---|---|
| cpx | 贝塞尔控制点的x坐标 | 播放 ” |
| cpy | 贝塞尔控制点的y坐标 | 播放 ” |
| x | 终点的x坐标 | 播放 ” |
| y | 终点的y坐标 | 播放 ” |