Ketahui Bagaimana Putar dalam SVG

Grafik Vektor Boleh Gulung Fungsi Putar

Memutar imej akan mengubah sudut yang imej dipaparkan pada. Untuk grafik mudah, ini boleh menambah beberapa kepelbagaian dan minat terhadap apa yang mungkin menjadi imej yang mudah atau membosankan. Seperti semua perubahan, putar berfungsi sebagai sebahagian daripada animasi atau untuk grafik statik. Belajar cara menggunakan berputar dalam SVG, atau Skala Vektor Skalable , membolehkan anda meminta sudut yang berbeza untuk reka bentuk bentuk anda. Fungsi berputar SVG berfungsi untuk menghidupkan imej dalam arah yang sama.

Mengenai Putar

Fungsi berputar adalah mengenai sudut grafik. Apabila anda merekabentuk imej SVG , anda akan membuat model statik yang mungkin akan duduk di sudut tradisional. Sebagai contoh, satu persegi akan mempunyai dua sisi di sepanjang paksi X dan dua di sepanjang paksi Y. Dengan berputar, anda boleh mengambil dataran yang sama dan menjadikannya pembentukan berlian.

Dengan hanya satu kesan itu, anda telah pergi dari kotak yang sangat tipikal (yang sangat umum di laman web) ke berlian, yang tidak biasa sama sekali dan yang tidak menambahkan beberapa jenis visual yang menarik kepada reka bentuk. Putar juga merupakan sebahagian daripada kapasiti animasi di SVG. Lingkaran boleh berubah secara berterusan semasa dipaparkan. Gerakan ini boleh menarik perhatian pelawat dan membantu anda menumpukan pengalaman mereka ke kawasan atau elemen utama dalam reka bentuk.

Putar berfungsi pada teori bahawa satu titik pada imej akan tetap tetap. Bayangkan sekeping kertas yang dilekatkan pada kadbod dengan pin push. Lokasi pin adalah tempat tetap. Jika anda menghidupkan kertas dengan meraih pinggir dan memutarkannya mengikut gerakan mengikut arah jam atau berlawanan arah jam, pin tekan tidak bergerak, tetapi segiempat tepat masih berubah sudut. Kertas akan berputar, tetapi titik tetap pin kekal tidak berubah. Ini sangat mirip dengan bagaimana fungsi berputar berfungsi.

Putar Sintaks

Dengan berputar, anda menyenaraikan sudut giliran dan koordinat kawasan tetap.

transform = "berputar (45,100,100)"

Sudut putaran adalah perkara pertama yang anda tambahkan. Dalam kod ini, sudut putaran adalah 45 darjah. Titik pusat adalah apa yang anda akan tambahkan seterusnya. Di sini, titik pusat itu terletak pada koordinat 100, 100. Jika anda tidak memasuki koordinat kedudukan pusat, mereka akan menjadi lalai kepada 0,0. Dalam contoh di bawah, sudut akan tetap 45 darjah, tetapi sejak titik pusat belum ditubuhkan, ia akan menjadi lalai kepada 0,0.

transform = "berputar (45)"

Secara lalai, sudut pergi ke arah sebelah kanan graf. Untuk memutarkan bentuk dalam arah yang bertentangan, anda menggunakan tanda tolak untuk menyenaraikan nilai negatif.

transform = "putar (-45)"

Putaran 45 darjah adalah pusingan suku sejak sudut berdasarkan pada lingkaran 360 darjah. Sekiranya anda menyenaraikan revolusi sebagai 360, imej tidak akan berubah kerana anda secara literal membalikkannya dalam bulatan penuh, jadi hasil akhir akan sama dengan penampilan di mana anda bermula.