Je to trochu esoterické, jen jsem to jednou musel udělat sám a zjistil jsem, že je to matoucí, takže jsem si myslel, že k tomu udělám celé video.
Jde o to, že ne všechno je v SVG. je fantastické, protože to může být cokoli. Ale jeho syntaxe je jen o něco složitější než kterýkoli z ostatních tvarů. Takže (možná z toho důvodu?) Illustrator vždy vydává tvary v SVG s nejvhodnějším prvkem. Obdélníky jsou , jiné tvary složené pouze z přímek jsou a , nebo pokud jde o otevřený tvar a atd.
To by bylo v pořádku, kromě toho, že metody DOM pro tyto tvary se liší. Prvek cesty má metodu nazvanou, getTotalLength()která vám umožní vědět, jak dlouhá je cesta. To je docela skvělé a někdy užitečné, ale nemůžete to udělat jen na , žádném jiném prvku.
Jedním z důvodů, proč byste chtěli vědět, že délka je, protože ji chcete animovat tak, aby se tvar „nakreslil sám“ - skvělý malý designový efekt (sbírka příkladů). Můžete to udělat v CSS, ale je hezké použít nějaký JavaScript k použití toho CSS, takže pokaždé animuje perfektní vzdálenost.
Řekněme tedy, že chcete tento kreslicí efekt udělat, ale tvar je, takže JavaScript selže. Tento polygon můžete proměnit v cestu, aniž byste ji vizuálně změnili, jednoduchým přidáním bodu, který má Bézierův úchyt. Stejně jako v případě klikněte pomocí nástroje Pero a táhněte tak, aby rukojeti vycházely a zarovnaly rukojeti přímo podél čáry, která tam již je. Existence tohoto bodu z něj udělá výstup.
Pokud to uděláte hodně, existuje nástroj s názvem Poly2Path, který funguje a nevyžaduje tento zbytečný bod.