Кривая Безье и скорость анимации. Как построить зависимость изменения расположения от времени?
В моём случае используется любая кривая из кубических Безье, её характеристика не важна. Мне нужно построить зависимость для моего объекта перемещения между его расположением и временем aka продолжительностью анимации, опираясь на кривую Безье, как на скорость этого изменения. Перемещение имеет прямолинейную траекторию движения.
Как мне нужно изменять координаты объекта по X и Y в каждой итерации цикла по типу 'цикл(i < duration)', чтобы движение оставалось с прямой траекторией (по диагонали), но изменилась лишь скорость перемещения (анимации) ?
Или как это делает CSS, чтобы сделать аналогию на ЯП?
RAX7, Да! Но видишь ли, по первой ссылке происходит передвижение по кривой Безье, а не по той затемнённой диагонали. Вот как сделать это замедленное или ускоренное перемещение по диагонали в первой ссылке?
Ladreawm, интерполируй начальные и конечные координаты
function lerp(v0, v1, t) {
return v0 * (1 - t) + v1 * t;
}
const easing = BezierEasing(0, 0, 1, 0.5);
const eased = easing(t); // t - равномерное линейное время от 0 до 1
const x = lerp(ax, bx, eased); // ax, bx - начальная и конечная координата по оси x
const y = lerp(ay, by, eased); // ay, by - начальная и конечная координата по оси y
RAX7, "Если ты готов сдаться и просить о помощи, значит победа уже близка". Спасибо тебе дружище! Это ведь было даже логично, а я.. =). Я ценю твоё потраченное время на решение моей проблемы!
Ladreawm дорогой пользователь, настоятельно рекомендуем еще раз обратить самое пристальное внимание на п. 3.1 регламента работы сервиса (и, в особенности, на его последний абзац).
В противном случае ваши вопросы будут удаляться по причине тег-спама, а систематические нарушения приведут к блокировке учетной записи.
Эта штука называется animation curve. Если просто, то ваша кривая - эта функция f(t). Соответственно, в вашем случае будет V=f(t); затем просто используете скорость в вашем уравнении движения. В общем случае: x+=Vx, y+=Vy. Ну а как найти проекцию вектора скорости на оси координат вы ещё со школы знаете.
Блин, это ведь то самое! И вправду, представить как V (скорость) и с ней вычислять. Спасибо за оставленный ответ, не будь это важным через 5 лет, но это большая сила помочь кому-то! Спасибо!
