3.4贝塞尔曲线canvas提供了两个绘制贝塞尔曲线的API：ctx.quadraticCurveTo(cpx,cpy,x,y);二次贝塞尔曲线，(cpx,cpy)控制点(x,y)终点ctx.bezierCurveTo(cp1x,cp1y,cp2x,cp2y,x,y);三次贝塞尔曲线，(cp1x,cp1y)控制点一，(cp2x,cp2y)控制点二，(x,y)终端题外话：贝塞尔曲线的数学基础是早在1912年就著名的伯恩斯坦多项式。它最初是用来辅助汽车车身的工业设计。CSS3的transition-timing-function属性，该值可以设置为三次贝塞尔曲线方程transition-timing-function：cubic-bezier(0.1,0.7,1.0,0.1)。canvas绘图示例：//两次ctx.moveTo(200,100);ctx.quadraticCurveTo(230,250,350,200);//三次ctx.moveTo(450,250);ctx.bezierCurveTo(530,150,650,300,700,200);蓝色是控制点问题一：canvas如何通过控制点绘制曲线，或者这个不用的话，自己怎么画曲线：这个是n阶贝塞尔曲线曲线的方程：我们重点二（三）阶方程：B(t)是曲线上的一点，t取0到1之间的值，P0的起点，P2的终点，P1的控制点t从0开始到1区间值不断增加，B(t)不断在曲线上取点，从P0移动到P1constbx=(1-t)*(1-t)*start.x+2*t*(1-t)*control.x+t*t*end.x;constby=(1-t)*(1-t)*start.y+2*t*(1-t)*control.y+t*t*end.y;问题2：我怎么知道怎么选择控制点，尤其是开始和结束动态数据时（也就是我们在使用的时候，往往只知道起点P0和结束点P1）：这个可以根据可视化需要的曲线斜率方法不一致，但大体原理是相似的。可以选择起点和终点的垂直平分线上的一点作为控制点，然后用一个参数来控制曲线的弯曲程度//curvenessdegreeofcurvature(0-1)constcp={x:(start.x+end.x)/2-(start.y-end.y)*曲线，y:(start.y+end.y)/2-(end.x-start.x)*curveness};题外话：cp点的解法：线段的中点：constmid=[(start.x+end.x)/2,(start.y+end.y)/2];也可以根据起点和终点得到A向量v：constv=[end.x-start.x,end.y-start.y];将这个向量顺时针旋转90度，得到一个垂直于它的向量v2：constv2=[v.y,-v.x];那么中间控制点的坐标是（向量v2乘以曲线加上中间点坐标)constcp={x:mid.x+v2.xcurveness,y:mid.y+v2.ycurveness}={x:(start.x+end.x)/2-(start.y-end.y)*曲线，y:(start.y+end.y)/2-(end.x-start.x)*曲线}
