Моя цель состоит в том, чтобы оживить текст так, чтобы он перемещался по d-пути, как бегущая строка новостей (за исключением того, что в данном случае путь нерегулярный). ключевые кадры для увеличения значения startOffset, но если вы установите для startOffset достаточно высокое значение (попробуйте установить его на 50 в фрагменте кода ниже), он создает пространство в начале текста и скрывает конец текста вместо зацикливания.
Так как контур не является идеальным кругом, простое вращение всего SVG не срежет его.
<svg viewBox="-10 -10 100 100">
<path id="MyPath" fill="none" stroke="" d="M 20 20 C 90 0 100 60 40 60 C 10 60 0 30 20 20 Z" />
<g>
<text>
<textPath id="text-path" href="#MyPath" style="font-size: 5px !important; " startOffset="0">
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
</textPath>
</text>
</g>
</svg>