Adakah Transform Order Penting dalam SVG?

Memahami Susunan Transformasi dalam SVG

Dalam SVG, transformasi rantaian melibatkan penerapan berbilang transformasi pada elemen dalam jujukan tertentu. Susunan transformasi ini digunakan dengan ketara mempengaruhi hasil akhir.

Mengikut spesifikasi SVG, setiap transformasi digunakan pada sistem koordinat semasa, iaitu sistem koordinat selepas ia diubah suai oleh transformasi sebelumnya. Konsep ini penting dalam memahami perbezaan antara menggunakan perubahan dalam susunan yang berbeza.

Pertimbangkan dua segi empat tepat, seperti yang digambarkan dalam kod yang anda berikan. Segi empat tepat pertama mengalami skala (skala(2, 1)) diikuti dengan putaran (putar(10deg)). Segi empat tepat kedua mengalami penjelmaan yang sama tetapi dalam susunan terbalik (putar(10deg) skala(2, 1)).

Apabila segi empat tepat pertama berskala, sistem koordinatnya dilaraskan dengan sewajarnya, dengan lebar dan tingginya didarabkan sebanyak 2. Selepas itu, apabila putaran digunakan, segi empat tepat tidak diputar di sekeliling paksi asalnya tetapi di sekeliling paksi skala sistem koordinat. Ini mengakibatkan penampilan senget yang anda perhatikan.

Sebaliknya, apabila segi empat tepat kedua diputarkan dahulu, sistem koordinatnya tidak terjejas. Penjelmaan skala seterusnya hanya meningkatkan saiz segi empat tepat tanpa menyerongnya.

Ringkasnya, susunan penjelmaan adalah penting kerana setiap penjelmaan beroperasi pada sistem koordinat yang telah diubah suai oleh penjelmaan sebelumnya. Dalam kes segi empat tepat pertama, penskalaan mendahului putaran, membawa kepada condong. Dalam kes segi empat tepat kedua, putaran mendahului penskalaan, menghasilkan penampilan yang berbeza. Memahami konsep ini adalah penting untuk memanipulasi elemen dalam SVG menggunakan transformasi.

Atas ialah kandungan terperinci Adakah Transform Order Penting dalam SVG?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!