《SVG》safariでgetTotalLength()が動かないときの対処法


safari10で getTotalLength() が動かなかったので備忘録。

原因

原因は <rect> とか <polygon> のメソッドとして getTotalLength()が実行できないことでした。safari以外ではうごていたので、ちょっと盲点でした。

対処法

スクリプトはそのままで動かしたかったので<rect><polygon> を全て <path> に変換してあげました。

コマンドラインから変換できるようなツールとかもあったのですが、
今回はIllustratorで直接編集することにしました。

Illustratorでパスを <path>として書き出す

Illustratorで全てのパスを「複合パス」に変換します。
対象のオブジェクトを選択し、右クリックから「複合パスを作成」を選択します。

Illustratorで動くスクリプトを作成して、
SVGに書き出すときに処理していくのがいいかもしれないと思いました。

おわります。