Вопросы по теме 'svg-animate'
feGaussianBlur, feOffset и другие теги SVG не работают в Pyside WebView
PySide WebView не поддерживает эти теги? Или есть возможность поддерживать эти теги?
Это мой код SVG. Я сделал круг SVG, который использует этот фильтр и выполняет некоторый переход цвета с помощью javascript
<defs>...
232 просмотров
schedule
08.12.2022
SVG: анимация движения по анимированному пути
Когда я использую animateMotion по анимированному пути, Firefox (26) следует исходному пути, а Opera (17) и Chrome (32) следуют изменяющемуся пути. Например, в следующем svg красный прямоугольник заканчивается на позиции 100,10 в FF и на позиции...
602 просмотров
schedule
29.05.2024
Проектирование 2d анимации
Меня попросили сравнить следующие языки и найти лучший для создания 2D-графики. Можете ли вы предложить мне лучший из них. Языки --> webgl, opengl, svg, canvas с использованием html5. Мой проект в основном заключается в разработке 2D-анимации...
109 просмотров
schedule
07.06.2022
D3.js - анимировать точку вдоль пути с переменной скоростью
У меня есть три массива точек, которые определяют три пути, и мне нужно перемещать разные точки по каждому пути с возможностью изменения скорости. Три массива содержатся в другом массиве, поэтому структура в основном выглядит так:
DataByDays = [...
809 просмотров
schedule
05.12.2022
Переход полилиний SVG Animate
Может ли кто-нибудь опубликовать пример того, как анимировать полилинию или путь SVG?
Я хочу анимировать переход от синих к серым линиям. В идеале я ищу решение, которое работает из любой серой линии, не зная количества координат ее точек....
617 просмотров
schedule
18.09.2022
Несколько кубических безье в теге анимации SVG?
Я только что смотрел простую SVG-анимацию торта здесь , код CSS выглядит так:
@import url(http://fonts.googleapis.com/css?family=Lato:300italic);
html,
body {
width: 100%;
height: 100%;
}
body {
background: #ee9ca7;
}
#cake {
display:...
746 просмотров
schedule
13.02.2023
svg повернуть путь вокруг точки
У меня есть svg с парой путей: https://jsfiddle.net/homa/sbvsjxqe/
Я хочу повернуть пути вокруг центра. Когда я добавляю следующий код, путь выходит за пределы поля зрения и вращается по очень большому кругу:
<animateTransform...
1054 просмотров
schedule
20.06.2023
Путь Svg с анимацией
У меня есть путь, похожий на круг. Задача — заполнить путь цветом с анимацией. Анимация заливки должна быть круговой, а не сверху вниз или снизу вверх.
мой SVG-код:
<svg id="svg_circle" width="100%" height="100%"...
14303 просмотров
schedule
18.06.2022
как перевести путь svg
У меня есть svg спидометра. Я хочу создать анимацию. Есть игла, сделанная из дорожки. Я сгруппировал этот путь, чтобы я мог переводить или преобразовывать. Это метр/стрелка, которая должна двигаться в соответствии с заданным пользователем...
2813 просмотров
schedule
26.07.2022
Как сделать градиентную анимацию SVG плавной, а не шокирующей?
У меня есть SVG, где я хочу анимировать градиент, чтобы цвета выглядели динамично. Чтобы сделать это, мне нужна повторяемая анимация, которая большую часть времени выглядит так, как будто она что-то делает.
Однако при попытке анимировать анимацию,...
2178 просмотров
schedule
29.09.2023
Анимация SVG SMIL не работает в Firefox, если она связана с defs
Я хочу вращать несколько объектов. Я связываю объект с тегом использования и через href из определенного объекта внутри defs. Во всех браузерах работает анимация поворота. Только в Firefox (62.0.3 MacOS High Sierra) анимация вращения не работает....
181 просмотров
schedule
03.06.2022
Анимация вращения для звезд в файле svg
У меня есть файл svg, я хочу, чтобы звезды крутились как роторы. Мой код выглядит следующим образом:
.my-spin {
animation: spin 2s linear infinite;
}
@keyframes spin {
0% { transform: rotate(0deg); }
100% { transform:...
582 просмотров
schedule
09.10.2022
Анимация SVG борется с Safari 13.1 (Mac OS и IOS)
Я только что понял, что последняя версия Safari (v13.1), которая поставляется с macOs 10.15.4 и iOS 13.4, больше не поддерживает анимацию CSS в файлах SVG. Я использую этот трюк для отображения анимации загрузки в моем портфолио. Теперь отображается...
3234 просмотров
schedule
01.02.2023
Анимируйте SVG с помощью animateTransform (перевод + наклон)
Как я могу сделать так, чтобы красная полоса перекосилась в положение зеленого?
Я пытаюсь анимировать логотип с помощью анимации SVG. Поэтому я использую skewX и переход для animateTransform, но почему-то выполняется только анимация skewX....
452 просмотров
schedule
27.10.2022
Как я могу сделать анимацию SVG плавной и гладкой?
Я анимировал SVG, чтобы придать эффект рукописного ввода, я хочу сделать анимацию более плавной, так как в анимации появляется буква «W», она заставляет появляться и другую часть буквы, и я не могу уменьшить ширина штриха, так как остальная часть...
414 просмотров
schedule
10.02.2024
Функция JQuery для SVG для выполнения 2-й анимации, как только завершится 1-я анимация?
Я применил технику задержки анимации, но для достижения анимации с эффектом рукописного ввода мне пришлось вырезать объект везде, где он пересекается, нарисовать путь и преобразовать его в обтравочную маску, например. буква «W» разделена на 4 части и...
72 просмотров
schedule
23.07.2023
Анимировать svg на нарисованном пути
Я пытаюсь оживить круг, чтобы он двигался по нарисованному пути, но круг сходит с рельсов и вращается по кругу, но вперед и назад, а не по часовой стрелке.
<g id="XMLID_5_" >
<path id="XMLID_38_"...
67 просмотров
schedule
27.10.2023
Путь svg смещается со своего нормального положения при вращении
У меня есть часы svg, когда я поворачиваю стрелку, она перемещается из своего нормального положения, а также свойство transform-box элемента #minute-hand не работает в этом элементе svg
примечание: этот код svg сгенерирован иллюстратором
and...
83 просмотров
schedule
07.12.2022
