Ini sedikit esoteris, saya hanya perlu melakukannya sendiri satu kali dan merasa bingung, jadi saya pikir saya akan membuat video lengkap tentang itu.
Masalahnya, tidak semuanya ada di SVG. luar biasa karena bisa apa saja. Tetapi sintaks untuk itu hanya sedikit lebih kompleks daripada bentuk lainnya. Jadi (mungkin karena alasan itu?) Illustrator selalu mengeluarkan bentuk dalam SVG dengan elemen yang paling sesuai. Persegi panjang adalah , bentuk lain yang hanya terdiri dari garis lurus adalah a , atau jika berbentuk terbuka a , dll.
Tidak apa-apa, kecuali metode DOM untuk bentuk tersebut bervariasi. Elemen jalur memiliki metode yang disebut getTotalLength()yang memungkinkan Anda mengetahui berapa panjang jalur tersebut. Itu cukup keren dan terkadang berguna, tetapi Anda tidak bisa hanya melakukannya di elemen, tidak ada elemen lain.
Salah satu alasan Anda mungkin ingin mengetahui panjang tersebut adalah karena Anda bermaksud untuk menganimasikannya sehingga bentuk "menggambar sendiri" - efek desain kecil yang keren (kumpulan contoh). Anda dapat melakukannya di CSS, tetapi senang menggunakan beberapa JavaScript untuk menerapkan CSS itu sehingga menganimasikan jarak yang sempurna setiap saat.
Jadi katakanlah Anda ingin melakukan efek gambar itu, tetapi bentuknya begitu sehingga JavaScript gagal. Anda dapat mengubah poligon tersebut menjadi sebuah jalur, tanpa mengubahnya secara visual, hanya dengan menambahkan sebuah titik yang memiliki pegangan bezier. Seperti, klik dengan Pen tool dan seret sehingga pegangannya keluar dan sejajarkan pegangannya tepat di sepanjang garis yang sudah ada. Adanya titik tersebut akan menjadikannya sebagai keluaran.
Jika Anda sering melakukan ini, ada alat bernama Poly2Path yang berfungsi, dan tidak memerlukan titik yang berlebihan itu.