SVG-де қалай бұрылуға болатындығын біліңіз

Ауқымды векторлық графика Айналдыру функциясы

Кескінді айналдыру сол кескінді көрсететін бұрышты өзгертеді. Қарапайым графика үшін, бұл қарапайым немесе бұрмаланған сурет болуы мүмкін, кейбір алуан және қызығушылық қосуға болады. Барлық түрлендірулер сияқты, бұру да анимация бөлігі немесе статикалық графика үшін жұмыс істейді. SVG немесе Scalable Vector Graphics бағдарламасында айналдыруды үйрену пішіннің дизайнына нақты бұрышты сұрауға мүмкіндік береді. SVG айналдыру функциясы кескінді кез-келген бағытта бұру үшін жұмыс істейді.

Айналдыру туралы

Айналдыру функциясы графиктің бұрышы туралы. SVG кескінін жасаған кезде, сіз дәстүрлі бұрышта отыратын боласыз статикалық модель жасайтын боласыз. Мысалы, квадрат X-осі бойымен екі жағынан және Y осі бойымен екеуінен тұрады. Айналдыра отырып, сіз сол бір шаршыны алып, оны Алмазға айналдыра аласыз.

Бір ғана әсермен сіз өте әдеттегі емес қораптан (веб-сайттарда өте кең таралған) алмасқа айналдырдыңыз, ол әдеттегідей емес және дизайнға қызықты көрнекі әртүрлілікті қосқан жоқ. Rotate - SVG-те анимациялық мүмкіндіктердің бір бөлігі. Шеңбер тұрақты түрде көрсетіле алады. Бұл қозғалыс келушілердің назарын аударып, өздерінің тәжірибесін негізгі салада немесе дизайндағы элементтерге аударуға көмектеседі.

Суреттегі бір нүкте бекітілген күйінде қалатын теориядағы жұмыстарды бұру. Картонға ілгішпен бекітілген қағаз бумасын елестетіңіз. Істік орналасқан жер - тіркелген жер. Егер сіз қағазды сағат тіліне немесе сағат тіліне қарсы жылжыту арқылы айналдырсаңыз, түйме ешқашан жылжиды, бірақ тіктөртбұрыш бұрыштарды өзгертеді. Қағаз айналдырылады, бірақ түйменің бекітілген нүктесі өзгеріссіз қалады. Бұл айналдыру функциясы қалай жұмыс істейтініне өте ұқсас.

Синтаксатты бұру

Айналдыру кезінде бұрылысты бұрышы және тіркелген аймақтың координаттары келтіріледі.

transform = «айналу (45,100,100)»

Айналу бұрышы - сіз қосқан бірінші нәрсе. Бұл кодта айналу бұрышы 45 градус. Орталық нүкте келесіде қосылатын нәрсе. Мұнда орталық нүкте 100, 100 координаттарында орналасады. Егер сіз орталық күй координаттарын енгізбесеңіз, олар әдепкі бойынша 0,0 болады. Төмендегі мысалда бұрыш 45 градус болады, бірақ орталық нүкте орнатылмаған, ол әдепкі бойынша 0,0 болады.

transform = «rotate (45)»

Әдепкі бойынша, бұрыш графиктің оң жағына қарай өтеді. Пішінді қарсы бағытта бұру үшін теріс мәнді тізімдеу үшін минус белгісін қолданыңыз.

transform = «айналу (-45)»

45 градусқа айналу бұрыштар 360 градусқа созылғандықтан, төрттен бір айналым. Революцияны 360 деп санасаңыз, сурет өзгермейді, себебі сіз оны толық шеңберге айналдырасыз, сонан соң түпкі нәтиже сіз бастаған жерге ұқсас болады.