@dron112

Как задать анимацию для radialGradient у svg?

<svg
      preserveAspectRatio='none'
      className={styles.svg}
      width={'calc(100% + 8px)'}
      height={'calc(100% + 10px)'}
      viewBox='0 0 100% 100%'
      xmlns='http://www.w3.org/2000/svg'
    >
     <defs>
        <radialGradient id='exampleGradient'>
          <stop offset='12.57%' stopColor='#5D0EF5'>
          </stop>
          <stop offset='64.62%' stopColor='#A076F6'>
          </stop>
          <stop offset='101.16%' stopColor='#fff'>
          </stop>
        </radialGradient>
      </defs>
      
     <circle fill='url(#exampleGradient)' cx='40%' cy='15%' r='100%' />
</svg>


Есть такая svg - картинка, и мне нужно сделать чтобы градиент вращался вокруг своей оси, подскажи как это можно реализовать, я пробовал через animateTransform, 'этот способ не подходит потому что он поворачивает круг , а мне нужно что бы круг был на месте, а radialGradient вращался вокруг своей оси.
Возможно кто-то решал похожие задачи.
  • Вопрос задан
  • 48 просмотров
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы