How to stop an element at certain SVG coordinate points?

Question

JavaScript

Colleagues, hello everyone.
Faced with a very interesting task, but alone I can not cope.
And so the task:
There is an SVG inside which there is a line along which the element should move. I did the movement of the element along the trajectory (more precisely, I googled it), but now the task is to stop the element for a few seconds at certain points on the line (there may be several such points). Thank you all in advance.

Answer 1

We make an array of objects - breakpoints and duration. At each step, we check if there is an element with the current coordinate in the array, and if so, we add the duration from the found element to the default timeout. Like so .
UPD. Taken from the comments:
We add one more property to the elements of the array of stops - the name of the class. When stopping, we do classList.add, after the end of the stop, classList.remove (if necessary) - nothing complicated .