初面网初面网

曲线

二次贝塞尔曲线,需要两个点,控制点和终点。创建二次贝赛尔曲线之前,可以使用 moveTo() 方法进行改变。

ctx.moveTo(100,100);    // 这是起点
ctx.quadraticCurveTo(150,300,400,100);    // 前两个参数是控制点,后两个参数是终点

三次贝塞尔曲线,需要三个点。第一、第二个点是控制点,第三个点是结束点。

ctx.moveTo(50, 20);
ctx.bezierCurveTo(230, 30, 150, 60, 50, 100);

说明:

实际上,贝塞尔曲线的起始点,是当前路径的最后一个点。

更新于 2025/2/26