Scalabil Vector Graphics Rotate Funcția
Rotirea unei imagini va modifica unghiul în care este afișată imaginea respectivă. Pentru grafica simplă, aceasta poate adăuga o anumită varietate și interes pentru ceea ce altfel ar putea fi o imagine simplă sau plictisitoare. Ca și în cazul tuturor transformărilor, rotirea funcționează ca parte a unei animații sau pentru o grafică statică. Învățați cum să utilizați rotația în SVG sau Scalable Vector Graphics vă permite să solicitați un unghi distinct față de designul formei. Funcția de rotire SVG funcționează pentru a transforma imaginea în ambele sensuri.
Despre Rotire
Funcția de rotire se referă la unghiul graficului. Când proiectați o imagine SVG , veți crea un model static care probabil va sta într-un unghi tradițional. De exemplu, un pătrat va avea două laturi de-a lungul axei X și două de-a lungul axei Y. Dacă vă rotiți, puteți să luați același pătrat și să îl transformați într-o formare de diamante.
Cu doar un singur efect, ați trecut dintr-o cutie foarte tipică (care este super comună pe site-uri web) la un diamant, care nu este deloc comun și care nu a adăugat o varietate vizuală interesantă unui design. Rotația face parte și din capacitățile de animație din SVG. Un cerc se poate întoarce constant în timp ce este afișat. Această mișcare poate atrage atenția vizitatorilor și vă poate ajuta să vă concentrați experiența pe o zonă sau elemente cheie într-un design.
Rotiți lucrările pe teoria că un punct de pe imagine va rămâne fix. Imaginați-vă o bucată de hârtie atașată la carton cu un bolț. Locația PIN-ului este punctul fix. Dacă rotiți hârtia luând o margine și rotiți-o într-o mișcare în sensul acelor de ceasornic sau în sens contrar acelor de ceasornic, butonul de împingere nu se mișcă niciodată, dar dreptunghiul continuă să schimbe unghiurile. Hârtia se va roti, dar punctul fix al știftului rămâne neschimbat. Acest lucru este foarte similar cu modul în care funcția de rotire funcționează.
Rotiți sintaxa
Cu rotire, listați unghiul de întoarcere și coordonatele zonei fixe.
transforma = "rotate (45100100)"Unghiul rotației este primul lucru pe care îl adăugați. În acest cod, unghiul de rotație este de 45 de grade. Punctul central este ceea ce ați adăuga în continuare. Aici, acest punct central se situează la coordonatele 100, 100. Dacă nu introduceți coordonatele poziției centrale, acestea vor fi în mod prestabilit la 0,0. În exemplul de mai jos, unghiul ar fi în continuare de 45 de grade, dar deoarece punctul central nu a fost stabilit, acesta va fi implicit la 0,0.
transforma = "rotate (45)"Implicit, unghiul merge spre partea dreaptă a graficului. Pentru a roti forma în direcția opusă, utilizați un semn minus pentru a afișa o valoare negativă.
transforma = "rotate (-45)"O rotație de 45 de grade este un sfert de întoarcere, deoarece unghiurile se bazează pe un cerc de 360 de grade. Dacă listați revoluția ca 360, imaginea nu s-ar schimba, pentru că o literalmente o răsuciți într-un cerc complet, astfel încât rezultatul final ar fi identic în aparență cu locul unde ați început.