Šī ir nedaudz lietas ezotērika, man vienkārši vajadzēja to izdarīt vienu reizi man pašai, un man šķita, ka tā ir mulsinoša, tāpēc es domāju, ka es uztaisīšu visu videoklipu.
Lieta ir tāda , ka SVG ne viss ir . ir fantastiski, jo tas var būt jebkas. Bet tā sintakse ir tikai nedaudz sarežģītāka nekā jebkura cita forma. Tātad (varbūt šī iemesla dēļ?) Illustrator vienmēr izraksta SVG formas ar visatbilstošāko elementu. Taisnstūri ir , citas formas, kas sastāv tikai no taisnām līnijām, ir a , vai, ja tā ir atvērta forma a , utt.
Tas būtu labi, izņemot to, ka DOM metodes šīm formām atšķiras. Ceļa elementam ir metode ar nosaukumu, getTotalLength()kas ļauj uzzināt, cik garš ir ceļš. Tas ir diezgan forši un dažreiz noderīgi, taču to nevar izdarīt tikai uz a , nav cita elementa.
Viens no iemesliem, kāpēc jūs vēlaties uzzināt šo garumu, ir tas, ka jūs plānojat to atdzīvināt tā, lai forma “uzzīmētu sevi” - mazais foršais dizaina efekts (piemēru kolekcija). To var izdarīt CSS, taču ir patīkami izmantot kādu JavaScript, lai pielietotu šo CSS, lai tas katru reizi animētu perfektu attālumu.
Tāpēc sakiet, ka vēlaties izdarīt šo zīmēšanas efektu, taču forma ir tāda , ka JavaScript neizdodas. Jūs varat pārvērst šo daudzstūri par ceļu, vizuāli to nemainot, vienkārši pievienojot tam punktu, kuram ir bezier rokturis. Tāpat kā šeit, noklikšķiniet ar pildspalvas rīku un velciet, lai rokturi iznāktu un izlīdzinātu rokturus pa taisno jau esošo līniju. Šī punkta esamība padarīs to par izvadi.
Ja jūs to darāt daudz, darbojas rīks Poly2Path, kas darbojas un kuram nav vajadzīgs šis liekais punkts.