キロバイト SVG チャレンジのツール セクションからリンクするために、ツール、プログラム、ユーティリティ、サポート ライブラリ、SVG の最適化に役立つコード プリミティブを最近ウェブで探しています。パスの座標の数を減らす方法について、精度を大幅に (または理想的にはまったく) 失うことなく削減する方法について説明します。
たとえば、このコカ・コーラのロゴのマーカー拡張バージョン( ~7kb、基本的にすべてのパス データ) を見てください。本質的に同じ曲線を生成しながら、より少ないノードを使用してパス。
ポリゴンとポリライン (「全行パス」と読みます) のはるかに単純な問題については、Douglas-Peucker または Visvalingam のアルゴリズム ( Mike Bostock による後者の優れた d3 実装を参照) を使用して、パスの形状に最も影響を与えない座標を単純に削除できます。あなたのニーズに合ったサイズと正確なフィット感に満足するまで.
私は、より大きな曲線 (または円弧) セグメントが、多くの手動調整なしで、これらの冗長な中間曲線座標停止の多くを置き換えることができる場所に気付く同等のものを探しています。一部のベクター グラフィックス パッケージ (Adobe Illustrator、おそらく Inkscape でさえ?) は、これらのような機能を提供する可能性があると思います (それらへのアクセス方法に関するヒントを歓迎します!)。人々のために余分なパスフィラー素材を絞り出すコマンドライン、またはWebアプリでさえ.
参考までに、Kilobyte SVG Challengeは、私が最近立ち上げた楽しい SVG 教育と擁護スタントです。それに関するすべての非質問トピックの議論は、そこで、および/または上記のリンクされた github リポジトリで行うのが最適です。素晴らしい滞在！:)