How to get Y value on bezier curve by X?

Question

JavaScript

How to get Y value on cubic bezier curve given X?
Coordinates of parametric points (for example)
0.0
.055,0.0,
0.55,0.24
1.1
And are there such libraries in npm?
I don't need it to build.

Answer 1

I had to write myself

__getYfromXBezier (x, points) {
        for (let i = 0; i < points.length - 1; i++) {
            if (points[i].x <= x && x <= points[i + 1].x) {
                const deltaX = x - points[i].x;
                let k = ((points[i+1].y - points[i].y) / (points[i+1].x - points[i].x));
                return deltaX * k + points[i].y;
            }
        }
    }

Answer 2

Anton Mudrenok , how categorically do you say that it’s impossible ... but if you really want to?
Let there be four points.
Usually, the curve is set parametrically in this form.
If we perform simple transformations, we get more familiar cubic equations for t
And similarly for y(t).
If we draw only from A(0,0) to D(1,1) (meaning such a picture) - we can simplify the resulting equation (or even better bring it immediately to the canonical form, but this is already a task for the author of the question)
This is where the actual algorithm that we need begins:
(If we draw from A(0,0) to D(1,1) and the coordinates of the remaining points are also from 0 to 1, then one root will always be obtained)
So in general - you can calculate the required values ​​​​with a fairly high accuracy

Answer 3

I faced such task.
Both my numerous attempts and googling led to the same solution - x is searched for by the method of half division by t=0..1. The speed and accuracy are quite satisfactory for practice.
You just need to remember to handle the special case when the Bezier curve is perpendicular to the abscissa axis - when solving head-on, division by zero is obtained there.
It is theoretically possible to solve a cubic equation, but in practice it is sooo hemorrhoids. Nobody does that. On the Internet you can find several materials that are approximately similar to Ivan Bogachev's answer: the same formulas are given, the same algorithm in general terms ... but no one goes further than this, nowhere have I seen attempts to throw at least a draft code. Like, everything is obvious. Although in fact there is the most tin and begins. Although I repeat, with a strong desire, this, of course, can be done.

Answer 4

I used this material when writing a software product (solution), on which, as a result, I published an article .. Maybe someone will be interested and help.
There is a solution code in VBA for Excel