在搜索网络时，我看到各种人在各种论坛中提到用二次曲线来近似三次曲线。但是我找不到公式。
我想要的是：
输入：startX，startY，control1X，control1Y，control2X，control2Y，endX，endY 输出：startX，startY，controlX，controlY，endX，endY
实际上，由于起点和终点相同，我只需要...
输入：startX，startY，control1X，control1Y，control2X，control2Y，endX，endY 输出：controlX，controlY
如前所述，从4个控制点到3个控制点通常会是一种近似。只有在立方贝塞尔曲线实际上是一个度数提高的二次贝塞尔曲线时，才会有一种情况是精确的。
您可以使用度数提高方程来得出近似值。这很简单，结果通常相当不错。
我们将立方体贝塞尔曲线的控制点称为Q0..Q3，二次贝塞尔曲线的控制点称为P0..P2。那么，对于度数提高，方程式为：
Q0 = P0
Q1 = 1/3 P0 + 2/3 P1
Q2 = 2/3 P1 + 1/3 P2
Q3 = P2
P1 = 3/2 Q1 - 1/2 Q0
P1 = 3/2 Q2 - 1/2 Q3
如果这是一个阶升三次方程，那么两个方程将会给P1相同的答案。但由于很可能不是，你最好的选择是将它们平均起来。因此，
P1 = -1/4 Q0 + 3/4 Q1 + 3/4 Q2 - 1/4 Q3
为了让您更易理解：
controlX = -0.25*startX + .75*control1X + .75*control2X -0.25*endX
Y的计算方式类似 - 维度是独立的，所以在3D（或n-D）中也适用。
这将是一个近似值。如果您需要更好的近似值，一种方法是使用deCastlejau算法对初始立方体进行细分，然后降低每个线段的次数。如果您需要更好的连续性，则有其他逼近方法，但它们较为缓慢且不够简洁。
P1 = -1/4 Q0 + 3/4 Q1 + 3/4 Q2 - 1/4 Q3 的公式？它运行得非常好... - Ecir Hanaget_t_values_of_critical_points()应该能够提供它们。function compare_num(a,b) {
if (a < b) return -1;
if (a > b) return 1;
return 0;
}
function find_inflection_points(p1x,p1y,p2x,p2y,p3x,p3y,p4x,p4y)
{
var ax = -p1x + 3*p2x - 3*p3x + p4x;
var bx = 3*p1x - 6*p2x + 3*p3x;
var cx = -3*p1x + 3*p2x;
var ay = -p1y + 3*p2y - 3*p3y + p4y;
var by = 3*p1y - 6*p2y + 3*p3y;
var cy = -3*p1y + 3*p2y;
var a = 3*(ay*bx-ax*by);
var b = 3*(ay*cx-ax*cy);
var c = by*cx-bx*cy;
var r2 = b*b - 4*a*c;
var firstIfp = 0;
var secondIfp = 0;
if (r2>=0 && a!==0)
{
var r = Math.sqrt(r2);
firstIfp = (-b + r) / (2*a);
secondIfp = (-b - r) / (2*a);
if ((firstIfp>0 && firstIfp<1) && (secondIfp>0 && secondIfp<1))
{
if (firstIfp>secondIfp)
{
var tmp = firstIfp;
firstIfp = secondIfp;
secondIfp = tmp;
}
if (secondIfp-firstIfp >0.00001)
return [firstIfp, secondIfp];
else return [firstIfp];
}
else if (firstIfp>0 && firstIfp<1)
return [firstIfp];
else if (secondIfp>0 && secondIfp<1)
{
firstIfp = secondIfp;
return [firstIfp];
}
return [];
}
else return [];
}
function get_t_values_of_critical_points(p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y) {
var a = (c2x - 2 * c1x + p1x) - (p2x - 2 * c2x + c1x),
b = 2 * (c1x - p1x) - 2 * (c2x - c1x),
c = p1x - c1x,
t1 = (-b + Math.sqrt(b * b - 4 * a * c)) / 2 / a,
t2 = (-b - Math.sqrt(b * b - 4 * a * c)) / 2 / a,
tvalues=[];
Math.abs(t1) > "1e12" && (t1 = 0.5);
Math.abs(t2) > "1e12" && (t2 = 0.5);
if (t1 >= 0 && t1 <= 1 && tvalues.indexOf(t1)==-1) tvalues.push(t1)
if (t2 >= 0 && t2 <= 1 && tvalues.indexOf(t2)==-1) tvalues.push(t2);
a = (c2y - 2 * c1y + p1y) - (p2y - 2 * c2y + c1y);
b = 2 * (c1y - p1y) - 2 * (c2y - c1y);
c = p1y - c1y;
t1 = (-b + Math.sqrt(b * b - 4 * a * c)) / 2 / a;
t2 = (-b - Math.sqrt(b * b - 4 * a * c)) / 2 / a;
Math.abs(t1) > "1e12" && (t1 = 0.5);
Math.abs(t2) > "1e12" && (t2 = 0.5);
if (t1 >= 0 && t1 <= 1 && tvalues.indexOf(t1)==-1) tvalues.push(t1);
if (t2 >= 0 && t2 <= 1 && tvalues.indexOf(t2)==-1) tvalues.push(t2);
var inflectionpoints = find_inflection_points(p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y);
if (inflectionpoints[0]) tvalues.push(inflectionpoints[0]);
if (inflectionpoints[1]) tvalues.push(inflectionpoints[1]);
tvalues.sort(compare_num);
return tvalues;
};
当你拥有那些关键的 t 值（范围在 0-1 之间）时，你可以将立方体分成几部分：
function CPoint()
{
var arg = arguments;
if (arg.length==1)
{
this.X = arg[0].X;
this.Y = arg[0].Y;
}
else if (arg.length==2)
{
this.X = arg[0];
this.Y = arg[1];
}
}
function subdivide_cubic_to_cubics()
{
var arg = arguments;
if (arg.length!=9) return [];
var m_p1 = {X:arg[0], Y:arg[1]};
var m_p2 = {X:arg[2], Y:arg[3]};
var m_p3 = {X:arg[4], Y:arg[5]};
var m_p4 = {X:arg[6], Y:arg[7]};
var t = arg[8];
var p1p = new CPoint(m_p1.X + (m_p2.X - m_p1.X) * t,
m_p1.Y + (m_p2.Y - m_p1.Y) * t);
var p2p = new CPoint(m_p2.X + (m_p3.X - m_p2.X) * t,
m_p2.Y + (m_p3.Y - m_p2.Y) * t);
var p3p = new CPoint(m_p3.X + (m_p4.X - m_p3.X) * t,
m_p3.Y + (m_p4.Y - m_p3.Y) * t);
var p1d = new CPoint(p1p.X + (p2p.X - p1p.X) * t,
p1p.Y + (p2p.Y - p1p.Y) * t);
var p2d = new CPoint(p2p.X + (p3p.X - p2p.X) * t,
p2p.Y + (p3p.Y - p2p.Y) * t);
var p1t = new CPoint(p1d.X + (p2d.X - p1d.X) * t,
p1d.Y + (p2d.Y - p1d.Y) * t);
return [[m_p1.X, m_p1.Y, p1p.X, p1p.Y, p1d.X, p1d.Y, p1t.X, p1t.Y],
[p1t.X, p1t.Y, p2d.X, p2d.Y, p3p.X, p3p.Y, m_p4.X, m_p4.Y]];
}
subdivide_cubic_to_cubics()通过值t将原始三次曲线分为两部分。由于get_t_values_of_critical_points()返回按t值排序的t值数组，因此您可以轻松遍历所有t值并获得相应的子曲线。当您拥有这些分割曲线时，您必须通过下一个t值来分割第二个子曲线。术语/约定
算法
第2步的“神奇公式”在此页面上演示（带有交互式示例）。
tfinniga的答案还有另一种推导方法：
首先请参考维基百科贝塞尔曲线，其中包含二次和三次贝塞尔曲线的公式（同时还有漂亮的动画效果）：
Q(t) = (1-t)^2 P0 + 2 (1-t) t Q + t^2 P3
P(t) + (1-t)^3 P0 + 3 (1-t)^2 t P1 + 3 (1-t) t^2 P2 + t^3 P3
要求这些在中间匹配，t = 1/2：
(P0 + 2 Q + P3) / 4 = (P0 + 3 P1 + 3 P2 + P3) / 8
=> Q = P1 + P2 - (P0 + P1 + P2 + P3) / 4
“Q” 在几何上有如下解释：
Pmid = middle of P0 P1 P2 P3
P12mid = midway between P1 and P2
draw a line from Pmid to P12mid, and that far again: you're at Q.
我可能会画一系列的曲线，而不是尝试使用不同的算法来绘制一条曲线。就像画两个半圆来组成一个整圆。
尝试寻找开源的Postscript字体转换为Truetype字体的工具。我相信他们会有这个工具。Postscript使用三次贝塞尔曲线，而Truetype使用二次贝塞尔曲线。祝你好运。