Функция поворота в SVG (масштабируемая векторная графика) позволяет вам указать угол, на который вы хотите повернуть данное изображение. Это работает, чтобы повернуть изображение в любом направлении.
Консорциум World Wide Web (W3C) определяет SVG как «язык, основанный на XML, для описания двумерной векторной и смешанной векторной / растровой графики. Содержимое SVG можно стилизовать, масштабировать до различных разрешений экрана и просматривать отдельно, смешанно. с содержимым HTML или встроенным с использованием пространств имен XML в другие языки XML. SVG также поддерживает динамические изменения; сценарий может использоваться для создания интерактивных документов, а анимация может выполняться с использованием функций декларативной анимации или с использованием сценария. «
О повороте
Функция поворота — все о углу графика. При разработке SVG-изображения вы создаете статическую модель, которая, вероятно, будет расположена под традиционным углом. Например, квадрат будет иметь две стороны вдоль оси X и две вдоль оси Y. С помощью поворота вы можете превратить этот же квадрат в алмаз.
Благодаря этому единственному эффекту вы перешли от обычного бокса (обычного элемента на веб-сайтах) к бриллианту, который добавляет интересное визуальное разнообразие в дизайн. Поворот также является частью анимационных возможностей SVG. Например, круг может постоянно поворачиваться при отображении. Это движение может сфокусировать опыт посетителя на ключевых областях или элементах дизайна.
Поворот предполагает, что одна точка на изображении останется фиксированной. Представьте себе лист бумаги, прикрепленный к картону с помощью канцелярской кнопки; расположение штифта является фиксированным местом. Если вы схватите край бумаги и поверните его, канцелярская кнопка не сдвинется, а прямоугольник повернется. Вот как работает функция поворота .
Повернуть Синтаксис
Чтобы использовать поворот , укажите угол поворота и координаты фиксированной области:
преобразования = "Поворот (45,100,100)"
В этом коде угол поворота составляет 45 градусов. Центральная точка идет дальше; в этом примере его координаты равны 100 на оси x и 100 на оси y. Если вы не введете координаты положения центра, по умолчанию они будут равны 0,0. В приведенном ниже примере угол все еще составляет 45 градусов, но центральная точка не была установлена; следовательно, по умолчанию будет 0,0.
преобразования = "Поворот (45)"
По умолчанию угол идет к правой стороне графика. Чтобы повернуть фигуру в противоположном направлении, вы используете знак минус, чтобы указать отрицательное значение:
преобразования = "Поворот (-45)"
Поворот на 45 градусов — это четверть оборота, учитывая, что углы основаны на круге на 360 градусов. Если вы перечислите оборот как 360, изображение не изменится, потому что вы бы перевернули его по кругу.
Таким образом, поворот дает вам полный контроль над углами ваших изображений.