SVG-д хэрхэн эргэх талаар сурах

Scalable Vector Graphics эргэх функц

Зургийг эргүүлэх нь тухайн зураг харагдах өнцөгийг өөрчилнө. Энгийн графикуудын хувьд энэ нь энгийн эсвэл уйтгартай дүр төрх ямар ч сонирхолтой, сонирхолтой байж болно. Бүх өөрчлөлтүүдтэй адилаар эргүүлэх ажил нь аниметын хэсэг эсвэл статик график хэлбэрээр ажиллана. SVG, эсвэл Scalable Vector Graphics дээр эргэхийг хэрхэн ашиглах талаар суралцах нь таны загварын дизайныг ялгаатай өнцгөөс авах боломжийг олгодог. SVG эргэлддэг функц нь аль ч чиглэлд дүрсийг эргүүлэх ажиллана.

Раундын талаар

Эргүүлэх функц нь графикын өнцгийн тухай юм. Та SVG дүрсийг бүтэээхдээ , та уламжлалт өнцөгт сууж болох статик загвар үүсгэх болно. Жишээлбэл, квадрат нь X тэнхлэгийн дагуу хоёр талд, хоёр тэнхлэгийн дагуу хоёр талд байрлана. Эргээд эргүүлээд, тэрхүү дөрвөлжинг авч алмаз эрдэнийн хувирал болгон хувиргаж болно.

Зөвхөн энэ нөлөөгөөр та ердийн хайрцаг (вэбсайтууд дээр маш их нийтлэг байдаг) алмааз руу шилжсэн бөгөөд энэ нь нийтлэг биш бөгөөд дизайны зарим сонирхолтой дүрслэлийг нэмээгүй байна. Ротари нь SVG-ийн хөдөлгөөнт хүчний чадавхийн нэг хэсэг юм. Дугуйлангууд гарч ирэх үед байнга эргэж болно. Энэ хөдөлгөөн нь зочдын анхаарлыг татах бөгөөд дизайны гол талбар буюу элементүүд дээр туршлагаа төвлөрүүлэхэд тусалдаг.

Тойрог дээр зураг дээрх нэг цэг тогтмол хэвээр байх онол дээр ажиллана. Нь түлхэх зүү бүхий цаасан дээр хавсаргасан цаасан дээр төсөөлөөд үз дээ. Нүдний байршил нь тогтмол цэг юм. Хэрэв та цаасыг эргүүлээд цагийн зүүний дагуу эсвэл цагийн зүүний дагуу эргүүлэхэд түлхэх зүү хэзээ ч хөдөлдөггүй боловч тэгш өнцөгт нь өөрчлөгдөнө. Цаас эргэх болно, гэхдээ зүүний тогтмол цэг өөрчлөгдөхгүй хэвээр байна. Энэ нь эргэлдэгч функц хэрхэн ажилладагтай маш төстэй юм.

Синтаксыг эргүүлэх

Эргээд эргүүлснээр эргэх өнцөг болон тогтмол талбайн координатыг жагсаана.

transform = "эргэх (45,100,100)"

Эргэлтийн өнцөг нь таны нэмж байна. Энэ кодонд эргүүлэх өнцөг 45 градус байна. Төвлөрсөн цэг нь дараагийн зүйл нэмнэ. Энд төвийн цэг 100, 100 координат сууж байна. Хэрэв та төвийн байрлалын координатад ордоггүй бол 0,0-тэй байх болно. Доорх жишээнд өнцөг нь 45 градус байх боловч төв цэг тогтоогдоогүй тул 0,0 байна.

transform = "rotate (45)"

Анхдагчаар, өнцөг нь графикийн баруун гар талд чиглэгдэнэ. Эсрэг чиглэлд хэлбэрийг эргүүлэхийн тулд хасах утгыг жагсаах хасах тэмдэг ашиглана.

transform = "эргэх (-45)"

45 градусын эргэлт нь 360 градусын тойрог дээр тулгуурласан өнцөгөөс хойш дөрөвний тойрог юм. Хэрэв хувьсгал 360-гээр жагсаавал энэ нь өөрчлөгдөхгүй, учир нь та үүнийг бүтэн тойргоор эргүүлж байгаа тул эцсийн үр дүн нь таны хаана эхэлсэнтэй адилхан байна.