Javascript 在贝塞尔曲线上获得一个点，无需猜测或暴力

我最初想使用四个点（因为贝塞尔曲线是用四个点定义的），但这迫使我对位置进行强制，所以我尝试了一种不同的方法，现在需要帮助：

我有一个起点P0，一个终点P1和斜率m0和m1，它们应该给我一个起点/终点斜率来计算它们之间的贝塞尔曲线。
曲线应该是函数的形式（3次），因为我需要得到给定点x的高度y

使用HTML5Canvas我可以画一条贝塞尔曲线，没有问题，使用这个函数

这允许我计算任何给定的点，给定一个百分比，我可以得到曲线的中心点。但我不需要依赖于t，而是y依赖于x，所以不是曲线的一半，而是P0和P1之间x距离的一半

要可视化的图像：

左边是我能计算的，右边是我需要的

我一直在尝试计算三次函数，给出两点P0，P1和斜率m0，m1，这会导致四个方程，我似乎无法用变量输入来求解。我还尝试使用上面的函数来计算t，使用x值（已知），但也没有骰子

我需要避免在这些计算中使用近似或昂贵的循环，因为它们对许多对象每秒执行多次，因此对我来说是不可行的

---

非常感谢您的帮助。

我在一个项目中遇到了同样的问题。我不知道从

x

获取

y

坐标的公式，我怀疑您在使用该路线时会遇到问题，因为贝塞尔曲线最多可以有3个点具有相同的x值

---

我建议使用BezierEasing库，该库专为此用例设计，并使用各种性能增强技术尽可能快地进行查找：

要解决此问题，需要以幂多项式形式重写Bezier方程

X(t) = t^3 * (P3.X-3*P2.X+3*P1.X-P0.X) + 
       t^2 * (3*P0.X + 6*P1.X+3*P2.X) + 
       t * (3*P1.X - 3P2.X) +
       P0.X 

if X(t) = P0.X*(1-ratio) + P3.X*ratio 
then
let d = ratio * (P0.X - P3.X)

求未知t

a*t^3 + b*t^2 + c*t + d = 0

---

然后将计算出的

t

参数（最多可能有三种解决方案）应用于Y分量并获得点坐标。请注意，公式是闭合的（没有循环），应该运行得足够快

感谢所有之前回答的人，这些通常都是很好的解决方案

在我的例子中，我可以100%确定我可以将曲线转换成一个三次函数，它作为贝塞尔曲线的近似值

因为在我的例子中，我可以控制我的点，我可以强制P0在x=0上，这简化了线性系统的计算，从而使我可以像这样更容易地计算三次函数：

let startPoint:Utils.Vector2=新Utils.Vector2（01100）；
let端点：Utils.Vector2=新Utils.Vector2（100100）；
设a:数，b:数，c:数，d:数；
函数calculateFunction（）{
设m0:number=0；
设m1:number=0；
a=（-endPoint.x*（m0+m1）-2*startPoint.y+2*endPoint.y）/-Math.pow（endPoint.x，3）；
b=（m1-m0-3*a*Math.pow（endPoint.x，2））/（2*endPoint.x）；
c=m0；
d=起始点y；
}