@gelosoft
Frontend-developer

Как получить значение Y на кривой безье по X?

Как получить значение Y на кубической кривой Безье по заданному X?
Координаты параметрических точек(для примера)
0,0
.055,0.0,
0.55,0.24
1,1
И есть ли такие библиотеки в npm?
Мне надо не для построения.
  • Вопрос задан
  • 1258 просмотров
Решения вопроса 1
@gelosoft Автор вопроса
Frontend-developer
Пришлось писать самому
__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;
            }
        }
    }
Ответ написан
Пригласить эксперта
Ответы на вопрос 3
sfi0zy
@sfi0zy Куратор тега JavaScript
Creative frontend developer
Антон Мудренок , как вы категорично говорите что никак нельзя... а если очень хочется?

Пусть есть четыре точки

A(x_%7B0%7D%2C%20y_%7B0%7D)%2C%20...%2C%

Обычно кривая задается параметрически вот в таком виде

x(t)%20%3D%20(1%20%E2%80%93%20t)%5E3%20xy(t)%20%3D%20(1%20%E2%80%93%20t)%5E3%20y

Если произвести нехитрые преобразования получаем более привычные взгляду кубические уравнения относительно t

x(t)%20%3D%20(%E2%80%93x_%7B0%7D%20%2B%2

И аналогично для y(t).

Если мы рисуем только из A(0,0) в D(1,1) (имеется в виду вот такая картинка) - можно упростить полученное уравнение (а еще лучше привести его сразу к каноническому виду, но это уже для автора вопроса задачка)

0%20%3D%20(3x_%7B1%7D%20%E2%80%93%203x_%

Тут и начинается собственно алгоритм, который нам нужен:
  • Задаем x(t)
  • решаем кубическое уравнение относительно t (например по формуле Кардано), получаем 3 корня, отбрасываем комплексные
  • оставшиеся подставляем в уравнение для y(t) - получаем необходимые значения y


(Если рисуем из A(0,0) в D(1,1) и координаты остальных точек также от 0 до 1, то всегда будет получаться один корень)

Так что в целом - можно посчитать необходимые значения с достаточно большой точностью
Ответ написан
dom1n1k
@dom1n1k
Я сталкивался с такой задачей.
И мои многочисленные попытки, и гугление привели к одинаковому решению - x ищется методом половинного деления по t=0..1. Скорость и точность получаются вполне удовлетворительные для практики.
Нужно только не забыть обработать особый случай, когда кривая Безье перпендикулярна оси абсцисс - при решении в лоб там деление на ноль получается.

Решать кубическое уравнение теоретически можно, но на практике ооочень геморно. Никто так не делает. В интернете можно найти несколько материалов, примерно аналогичных ответу Ivan Bogachev: приводятся те же формулы, тот же алгоритм в общих словах... но дальше этого ни у кого не заходит, нигде не видел попыток накидать хотя бы черновой код. Типа, дальше всё очевидно. Хотя на самом деле там самая жесть и начинается. Хотя повторюсь, при большом желании это, конечно, возможно сделать.
Ответ написан
@rick1177
Применил данный материал при написании программного продукта (решения), по которому, в итоге, опубликовал статью.. Может быть кому-то будет интересно и в помощь.
Там есть код решения на VBA для Excel
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы