SVGAnimationElement: метод getStartTime()

Метод SVGAnimationElement getStartTime() возвращает число с плавающей точкой, представляющее начальное время, в секундах, для текущего интервала этого элемента анимации, если он существует, независимо от того, начался ли этот интервал.

Начальное время, возвращаемое getStartTime() , измеряется в секундах относительно времени начала временной шкалы контейнера.

Время начала временной шкалы — это момент, когда контейнер времени начинает отсчёт своей временной шкалы. Оно служит точкой отсчёта для всех анимаций внутри этого контейнера.

Контейнер времени — это элемент или контекст, определяющий локальную временную шкалу для одной или нескольких анимаций. Анимации внутри контейнера времени измеряются относительно его временной шкалы. Если контейнер времени задерживается, приостанавливается или манипулируется, все анимации внутри него соответствующим образом корректируются.

Это свойство отражает атрибут begin элемента <animate>, <animateMotion> или <animateTransform>.

Нет (undefined).

Число с плавающей точкой.

InvalidStateError DOMException

Выбрасывается, если у SVGAnimationElement нет текущего интервала. Это происходит, когда время анимации по атрибуту begin не достигнуто или не определено, поэтому метод getStartTime() не может определить корректное начальное время. Например, когда анимация установлена на запуск через 3 секунды, но пользователь ещё не кликнул, чтобы запустить её.

В этом примере показано, как атрибут begin="3s" заставляет анимацию начинаться через 3 секунды после начала временной шкалы контейнера времени.

<svg width="200" height="200" viewBox="0 0 200 200">
  <circle cx="50" cy="50" r="20" fill="rebeccapurple">
    <animate attributeName="cx" from="50" to="150" dur="5s" begin="3s" />
  </circle>
</svg>

const animationElement = document.querySelector("animate");

const startTime = animationElement.getStartTime();
console.log(
  `The animation starts at: ${startTime} seconds relative to the time container's timeline`,
); // Output: 3

Метод getStartTime() возвращает 3.0 , так как это время относительно начала временной шкалы контейнера.