1、查看动态曲线的链接;
https://www.jasondavies.com/animated-bezier/
2、公式与原理;
一阶曲线:
一阶曲线Px的坐标容易计算,其中t=PoPx/PoP1,用表示Px点坐标:
二阶曲线:
①在AB上任选一个点 D。计算该点到线段起点的距离 AD,与该线段总长 AB 的比例t。
②从BC上找出对应的点 E,使得 AD:AB=BE:BC=t。
下面进行公式推导:
P‘0 对应D点坐标,P‘1对应E点坐标。
由此可得到Bt点坐标(Bt点满足DBt:DE=t,类似规则下面解释):
到此,即可得到贝塞尔曲线二阶的公式。
与二阶贝塞尔曲线类似,可以通过相同的方法得出三阶坐标公式:
只不过我们每确定一个贝塞尔曲线上的点,要进行三轮取点操作。如图,AE:AB = BF:BC = CG:CD = EH:EF = FI:FG = HJ:HI,其中点 J 就是最终得到的贝塞尔曲线上的一个点。
多阶贝塞尔曲线
n阶贝塞尔曲线公式:
即:
公式中的值为,与统计学有关。
其中的值为:
备注:关于曲线点坐标的左边实际值可从相似三角形的角度去理解和计算,具体过程已省略。
参考链接:https://juejin.cn/post/6844903666361565191