@TheInsable

Как лучше реализовать анимацию в js/canvas?

Понятное дело, что нужно использовать requestanimationframe, но эта функция жестко привязана к частоте монитора, т.е. если монитор 144hz, то при рекурсии requestanimationframe сработает 144 раза за секунду, а на обычных мониторах 60-75, отсюда выходит, что люди с разной герцовкой увидят разную скорость анимации.
Т.е. если я хочу анимировать какой-то объект и сместить его положение на 150px, изменяя его положение на 1px каждый requestanimationframe, то у кого-то анимация проскочит за ~1 секунду, а у кого-то за ~2.5.

Как лучше всего решить эту проблему?
  • Вопрос задан
  • 119 просмотров
Решения вопроса 1
VoidVolker
@VoidVolker Куратор тега JavaScript
Dark side eye. А у нас печеньки! А у вас?
Анимация привязывается ко времени, а не к шагу. Каждый фрейм анимации может длиться любое количество времени. Поэтому, надо каждый фрейм не прибавлять 1 px, а проверить сколько прошло времени с предыдущего фрейма и вычислить новое положение объекта в пространстве.
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

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

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