Det här är lite esoteriskt, jag behövde bara göra det själv en gång och tyckte det var förvirrande så jag trodde att jag skulle göra en hel video på den.
Saken är att inte allt är i SVG. är fantastiskt eftersom det kan vara vad som helst. Men syntaxen för den är bara lite mer komplex än någon av de andra formerna. Så (kanske av den anledningen?) Illustrator matar alltid ut formerna i SVG med det mest lämpliga elementet. Rektanglar är , andra former som består av bara raka linjer är a , eller om det är en öppen form a , etc.
Det skulle vara bra, förutom att DOM-metoderna för dessa former varierar. Ett sökelement har en metod som kallas getTotalLength()som låter dig veta hur lång sökvägen är. Det är ganska coolt och ibland användbart, men du kan inte bara göra det på ett , inget annat element.
En anledning till att du kanske vill veta den längden är för att du tänker animera den så att formen "drar sig själv" - en cool liten designeffekt (samling av exempel). Du kan göra det i CSS, men det är trevligt att använda JavaScript för att använda den CSS så att den animerar det perfekta avståndet varje gång.
Så säg att du vill göra den ritningseffekten, men formen är a så att JavaScript misslyckas. Du kan förvandla polygonen till en bana utan att ändra den visuellt genom att helt enkelt lägga till en punkt i den som har bezierhandtag. Som i, klicka med pennverktyget och dra så att handtagen kommer ut och rikta in handtagen längs linjen som redan finns. Förekomsten av den punkten kommer att göra den till en in-output.
Om du gör detta mycket finns det ett verktyg som heter Poly2Path som fungerar och kräver inte den överflödiga punkten.