Как я понимаю, свойства Transform в snap.svg?

Как я понимаю свойства Transform в snap.svg?

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

Редактировать: Snap не делает различий между прописными и строчными буквами в наши дни, поэтому эта часть не имеет значения (хотя, возможно, стоит об этом знать, если вы видите какой-то код Raphael.js и хотите понять), остальное все еще должно быть актуальным, хотя …

T / t = Перевести (t является относительным, T является абсолютным) R / r = повернуть (r является относительным, R является абсолютным) S / s = масштаб (s является относительным, S является абсолютным)

Стоит посмотреть документацию по преобразованию Рафаэля, если у Snap.svg недостаточно информации, поскольку существует много совпадений.

Для трансформаций некоторые ссылаются на «центр происхождения», относительно которого нужно вращать / масштабировать и т. Д., Так как иногда вы можете захотеть, чтобы центром происхождения был сам объект, иногда 0,0, иногда вокруг определенной точки.

t-10 0 s0 32 32 будет переводить x, y -10,0, а затем масштабировать x, y, cx, cy, так масштабировать 0 на x, 32 на пути вокруг cx 32.

r180 32 32 будет поворачиваться на 180 градусов вокруг точки 32,32. Обычно вы можете использовать запятую или пробел для разделения значений.

after представляет значения «атрибута» для установки после завершения анимации. animafter представляет «анимационные» значения, которые нужно установить после завершения анимации.

Понравилась статья? Поделиться с друзьями:
JavaScript & TypeScript
Adblock
detector