Ускоренное движение картинки

[Deedle]

Привет, коллеги!

Встала непростая задачка. Имеются массивы приращений пути delta_s и времени delta_t.

delta_s = [0, 0.0926, 0.0987, 0.1046, 0.1104, 0.116, 0.1216, 0.127, 0.1324, 0.1377, 0.1429, 0.148, 0.153, 0.158, 0.1629, 0.1678, 0.1726, 0.1774 и т.д. и т.п... 150.4106] метры

delta_t = [0, 0.0707, 0.0698, 0.0688, 0.068, 0.0671, 0.0663, 0.0655, 0.0648, 0.0641, 0.0634, 0.0628, 0.0621, 0.0616, 0.061, 0.0604, 0.0599, 0.0594, и т.д. и т.п... 2.5743] секунды

Имеется картинка, которую нужно перемещать по прямой, наращивая её координаты от левого края к правому по данным из delta_s с учетом времени delta_t по следующему принципу:

В начальный момент времени delta_t[0] картинка в положении delta_s[0] (на месте). Спустя 0.0707 секунд (delta_t[1]) картинка должна быть в положении 0.0926 метра правее (delta_s[1]). Через еще 0.0698 секунды (delta_t[2]) картинка должна "пройти" еще 0.0987 метра (delta_s[2]) и т.д.

Скорость картинки со временем увеличивается (неравномерно, как вы могли заметить).

Проблема в том, что при движении картинки скорость визуально уменьшается за счет того, что интервалы времени и преодолеваемое расстояние УВЕЛИЧИВАЮТСЯ. Т.е. к концу пути картинка начинает двигаться "медленнее" и рывками.

Пожалуйста подскажите как добиться реалистичности и возможно ли это в рамках JS?

P.S. Для наглядности можно представить, что картинка это движущийся автомобиль, стартующий с места.

[dmitriymar]

Проблема в том, что при движении картинки скорость визуально уменьшается за счет того, что интервалы времени и преодолеваемое расстояние УВЕЛИЧИВАЮТСЯ. Т.е. к концу пути картинка начинает двигаться "медленнее" и рывками.

да почему? метры увеличиваются,время уменьшается-скорость растёт.
а таймауты -означают что действие произойдёт не ранее чем через заданное время-ключевое слово не ранее,может и в разы позже-зависит от загруженности списка процессов

[Deedle]

время уменьшается

В том-то и дело, что нет (в большинстве случаев). Я привел не весь массив времени. Где-то интервалы увеличиваются, а где-то уменьшаются. Вот полный массив:

delta_t = [0.0707, 0.0698, 0.0688, 0.068, 0.0671, 0.0663, 0.0655, 0.0648, 0.0641, 0.0634, 0.0628, 0.0621, 0.0616, 0.061, 0.0604, 0.0599, 0.0594, 0.0589, 0.0584, 0.058, 0.0576, 0.0572, 0.0568, 0.0564, 0.056, 0.0557, 0.0554, 0.055, 0.0547, 0.0545, 0.0542, 0.0539, 0.0537, 0.0534, 0.0532, 0.053, 0.0528, 0.0526, 0.0524, 0.0523, 0.0521, 0.052, 0.0518, 0.0517, 0.0516, 0.0515, 0.0514, 0.0513, 0.0512, 0.0512, 0.0511, 0.051, 0.051, 0.051, 0.051, 0.0509, 0.0509, 0.0509, 0.051, 0.051, 0.051, 0.0511, 0.0511, 0.0512, 0.0513, 0.0513, 0.0514, 0.0515, 0.0516, 0.0518, 0.0519, 0.052, 0.0522, 0.0523, 0.0525, 0.0527, 0.0529, 0.0531, 0.0533, 0.0535, 0.0538, 0.054, 0.0543, 0.0546, 0.0549, 0.0552, 0.0555, 0.0558, 0.0562, 0.0565, 0.0569, 0.0573, 0.0577, 0.0582, 0.0586, 0.0591, 0.0596, 0.0601, 0.0606, 0.0612, 0.0618, 0.0624, 0.063, 0.0637, 0.0644, 0.0651, 0.0658, 0.0666, 0, 0.0434, 0.1412, 0.1411, 0.141, 0.141, 0.1411, 0.1411, 0.1412, 0.1413, 0.1414, 0.1415, 0.1417, 0.1419, 0.1422, 0.1424, 0.1427, 0.143, 0.1434, 0.1438, 0.1442, 0.1446, 0.1451, 0.1456, 0.1461, 0.1467, 0.1473, 0.1479, 0.1486, 0.1493, 0.15, 0.1508, 0.1516, 0.1525, 0.1534, 0.1544, 0.1553, 0.1564, 0.1575, 0.1586, 0.1598, 0.161, 0.1623, 0.1637, 0.1651, 0.1665, 0.1681, 0.1697, 0.1713, 0.1731, 0.1749, 0.1768, 0.1788, 0.1809, 0.183, 0.1853, 0.1877, 0.1902, 0, 0.23, 0.2962, 0.2975, 0.2988, 0.3002, 0.3017, 0.3033, 0.3049, 0.3066, 0.3084, 0.3104, 0.3124, 0.3145, 0.3167, 0.319, 0.3214, 0.3239, 0.3266, 0.3293, 0.3322, 0.3353, 0.3384, 0.3417, 0.3452, 0.3488, 0.3526, 0.3566, 0.3607, 0.3651, 0.3696, 0.3744, 0.3794, 0.3846, 0.3901, 0.3959, 0.4019, 0.4083, 0, 0.3043, 0.6822, 0.6866, 0.6913, 0.6962, 0.7013, 0.7067, 0.7124, 0.7184, 0.7248, 0.7314, 0.7383, 0.7457, 0.7533, 0.7614, 0.7699, 0.7788, 0.7881, 0.798, 0.8083, 0.8191, 0.8306, 0.8426, 0.8552, 0.8686, 0.8826, 0.8975, 0.9132, 0.9297, 0.9473, 0.9658, 0.9855, 1.0064, 1.0286, 1.0523, 1.0775, 1.1044, 1.1333, 0, 1.2668, 1.4306, 1.4592, 1.4896, 1.5219, 1.5565, 1.5933, 1.6328, 1.675, 1.7204, 1.7693, 1.822, 1.8789, 1.9407, 2.0078, 2.0811, 2.1612, 2.2493, 2.3465, 2.4542, 2.5743];

[dmitriymar]

Значит взять единицу времени -(24 кадра в секунду для глаза норм)
Итого:
1000 м.с /24~ 40 м.с.
Через каждые 40 м.с нужно показывать новый кадр.
И для каждого кадра рассчитывать расстояние смещения.Данных для этого у вас достаточно.
А вообще,вы представления об анимации вообще не имеете, если задаёте подобные вопросы. Сначала ознакомитесь с основами анимации, а потом уже переводите в код

[Deedle]

dmitriymar, Вы правы, представления не имею никакого, просто нужно сделать на скорую руку. Спасибо за совет - попробую!