Числовые значения в mo.js формируют основу описания всех анимационных параметров: от длительности и траектории до геометрии форм и физических моделей движения. Любой объект анимации оперирует набором свойств, которые интерпретируются движком как числа, диапазоны чисел или функции, возвращающие числовые значения.
Базовый формат задания параметров представляет собой обычное число. Оно используется напрямую без преобразований и интерпретируется как фиксированное значение на протяжении всей анимации.
К таким параметрам относятся:
Фиксированные числа обеспечивают детерминированное поведение, при котором результат полностью предсказуем и воспроизводим.
В некоторых параметрах допускается использование строкового представления чисел с единицами измерения. Такой формат применяется для свойств, связанных с визуальной геометрией:
px для пикселей% для относительных значенийdeg для угловrad для радиановПодобные значения проходят стадию парсинга, в ходе которой выделяется числовая часть и единица измерения. После этого выполняется нормализация в числовой формат, пригодный для интерполяции.
Распространённый способ задания изменяющихся параметров — использование диапазона в виде объекта с двумя границами:
{ 0: 100 }Такой формат задаёт интерполяцию между начальным и конечным значением. Внутренний механизм mo.js преобразует диапазон в функцию изменения значения во времени.
Диапазоны применяются для:
Интерполяция осуществляется линейно или с применением кривых сглаживания.
Числовая интерполяция в mo.js основана на вычислении промежуточных значений между ключевыми точками. Базовая формула линейной интерполяции:
y = (1 - t)a + tb
где:
a — начальное значениеb — конечное значениеt — нормализованное время (от 0 до 1)При применении easing-функций параметр t проходит
нелинейное преобразование, что изменяет характер движения: ускорение,
замедление или колебания.
Длительность анимации задаётся числом в миллисекундах. Это один из ключевых параметров таймлайна, влияющий на синхронизацию всех вложенных анимаций.
Слишком малые значения приводят к визуальной дискретности, тогда как большие значения увеличивают плавность переходов, но снижают динамику сцены.
Параметр задержки определяет смещение начала анимации относительно стартового момента. Числовая модель задержки используется для создания каскадных эффектов и последовательных запусков.
Положение объектов описывается числовыми значениями по осям X и Y. Эти параметры могут задаваться как абсолютными числами, так и диапазонами.
Изменение координат во времени формирует траектории движения, которые могут быть линейными или криволинейными в зависимости от дополнительных параметров.
Радиус окружностей, размеры фигур и толщины линий задаются числовыми значениями. Эти параметры активно участвуют в анимациях burst-эффектов, где геометрия изменяется экспоненциально или линейно.
mo.js поддерживает поведенческие модели, основанные на физике пружин и демпфирования. В таких системах числа определяют:
Поведение системы описывается дифференциальными зависимостями, в которых числовые параметры определяют характер движения.
Числовые параметры могут быть заданы как случайные диапазоны. В этом случае значение вычисляется при каждом запуске анимации, что создаёт вариативность поведения.
Применяются следующие подходы:
Подобный механизм используется для генерации частиц, взрывов и органических движений.
Вместо фиксированного числа может использоваться функция, возвращающая значение в зависимости от времени или других параметров анимации.
Функциональные значения позволяют:
Функция получает входные параметры контекста анимации и возвращает вычисленное числовое значение, которое используется на текущем кадре.
Статические значения остаются неизменными на протяжении всей анимации. Динамические значения изменяются во времени через интерполяцию, функции или физические модели.
Разделение моделей позволяет оптимизировать вычисления:
Перед использованием все числовые параметры проходят этап нормализации. Он включает:
Нормализация обеспечивает единообразие внутреннего представления данных, независимо от входного формата.
Точность числовых вычислений влияет на плавность анимации. Ошибки округления могут приводить к:
Для минимизации подобных эффектов используются оптимизированные алгоритмы интерполяции и ограничение частоты перерасчёта значений.
В сложных сценах числовые значения объединяются в последовательности, формируя таймлайны. Каждый этап таймлайна представляет собой набор числовых параметров, активируемых в определённый момент времени.
Такая структура позволяет: