Mengapa Transform Order Penting dalam SVG: Skala/Putar lwn Putar/Skala?

Kepentingan Tertib Transformasi: Mengapa Putar/Skala Berbeza daripada Skala/Putar

Merangkai transformasi dalam SVG melibatkan penerapan satu siri transformasi dalam tertib tertentu untuk mengubah sistem koordinat unsur. Tertib ini boleh memberi kesan ketara kepada bentuk yang terhasil.

Spesifikasi SVG menekankan bahawa setiap transformasi digunakan pada sistem koordinat semasa, yang merupakan "salinan" daripada yang awal. Apabila sistem koordinat ini berskala, putaran seterusnya berlaku di sekitar asal berskala. Ini menerangkan sebab, dalam contoh yang diberikan, segi empat tepat pertama (diubah sebagai skala(2, 1) berputar(10deg)) kelihatan condong.

Pertimbangkan sistem koordinat awal sebagai segi empat sama. Skala (2, 1) meregangkannya secara mendatar, menggandakan lebarnya. Apabila kita kemudian berputar sebanyak 10 darjah, putaran berlaku di sekeliling lebar dan ketinggian yang berskala, mengakibatkan bucu dihamparkan secara berbeza, menghasilkan kesan senget.

Sebaliknya, apabila kita berputar dahulu (putarkan (10deg) skala(2, 1)) seperti dalam segi empat tepat kedua, putaran berlaku di sekeliling asal awal, tanpa dipengaruhi oleh skala yang berikut. Ini menghasilkan segi empat tepat diperbesarkan tanpa sebarang pencongan.

Perbezaan ini mempamerkan peranan penting susunan transformasi apabila merantai transformasi. Adalah penting untuk memahami cara setiap transformasi mempengaruhi sistem koordinat untuk mencapai hasil yang diinginkan.

Atas ialah kandungan terperinci Mengapa Transform Order Penting dalam SVG: Skala/Putar lwn Putar/Skala?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!