Tai šiek tiek ezoteriškas dalykas, man tiesiog reikėjo tai padaryti vieną kartą ir man pasirodė painu, todėl maniau, kad padarysiu visą vaizdo įrašą.
Reikalas tas, kad ne viskas yra SVG. yra fantastiška, nes tai gali būti bet kas. Bet jo sintaksė yra tik šiek tiek sudėtingesnė nei bet kurios kitos formos. Taigi (galbūt dėl šios priežasties?) „Illustrator“ visada pateikia SVG formas su tinkamiausiu elementu. Stačiakampiai yra , kitos formos, sudarytos tik iš tiesių, yra a , arba, jei tai yra atvira forma a ir kt.
Tai būtų puiku, išskyrus tai, kad DOM metodai šioms formoms skiriasi. Kelio elementas turi vadinamąjį metodą, getTotalLength()kuris leidžia jums žinoti, kiek kelias yra ilgas. Tai gana šaunu ir kartais naudinga, tačiau to padaryti negalima tik naudojant „a“ , be jokio kito elemento.
Viena iš priežasčių, kodėl galbūt norėsite žinoti apie ilgį, yra ta, kad ketinate ją atgaivinti taip, kad figūra „pieštų save“ - mažas šaunus dizaino efektas (pavyzdžių rinkinys). Tai galite padaryti naudodamiesi CSS, tačiau malonu naudoti tam tikrą „JavaScript“, kad pritaikytumėte tą CSS, kad jis kiekvieną kartą animuotų puikų atstumą.
Taigi sakykite, kad norite padaryti tą piešimo efektą, bet forma yra tokia , kad „JavaScript“ nepavyktų. Tą daugiakampį galite paversti keliu, vizualiai jo nekeisdami, paprasčiausiai pridėdami tašką su bezier rankena. Kaip ir, spustelėkite naudodamiesi rašiklio įrankiu ir vilkite, kad rankenos išeitų ir sulygintų rankenas tiesiai iš jau esamos linijos. To taško buvimas padarys jį išvestimi.
Jei tai darote daug, yra įrankis, vadinamas Poly2Path, kuris veikia ir nereikalauja to nereikalingo taško.