SVGのアンカーポイントが多すぎる原因と減らし方
ポイントが少ないほど、曲線はなめらかに、ファイルは軽く、カットはきれいになります。
SVGのアンカーポイントが多すぎるのは、トレースが1本のなめらかな曲線を描くかわりに、輪郭に沿ったピクセルの段差を1つ残らずたどってしまうからです。4つか8つのポイントで済むはずの円が、60個になります。ファイルは重くなり、編集は面倒になり、カッティングマシンやレーザーは細かい線分のたびに減速してガタつきます。
解決策は、なめらかな曲線を優先する設定でトレースし直すことです。アンカーポイントを少なく、曲線をなめらかに、色を少なく、小さな点はなしにします。できあがったSVGをあとから単純化する方法もありますが、角が丸まったり輪郭がずれたりしがちです。下に画像をドロップし、パスとアンカーポイントを表示をオンにすると、トレース結果のポイント数を確認できます。
お手持ちの画像で試す
アンカーポイントの少ない、なめらかなSVG
アンカーポイントとは何か、なぜ数が大事なのか
SVGのパスは、直線や曲線の線分がつながったものです。1つの線分が終わり、次の線分が始まる点がアンカーポイントです（Inkscapeなどではノードと呼びます）。よいトレースは、形の向きが変わる場所にだけポイントを置き、あとは曲線に任せます。
- 編集：ポイントの1つ1つが、ドラッグして直すかもしれない対象です。ポイントが数百個のロゴなら簡単に調整できますが、数千個あると手に負えません。
- カットと彫刻：マシンはポイントからポイントへと動きます。何百もの細かい線分があると、刃やレーザーヘッドがガタつき、縁が粗くなり、時間もかかります。
- ファイルサイズ：ポイントが多いほどファイルは重くなります。Webのアイコンや、アップロードの容量制限があるマーケットプレイスでは無視できません。
- 見た目：短い線分に細切れになった曲線は、デザインを拡大すると小さなよれが見えることがよくあります。
自動トレースしたSVGのポイントが多くなる理由
- 元画像が小さい・解像度が低い：小さなサイズでは、曲線の縁はピクセルの階段になっていて、トレースはその段差をたどります。
- JPGの圧縮とノイズ：まだらな縁や点々のある部分が何十もの小さな図形になり、それぞれにポイントが付きます。
- 色が多すぎる：グラデーションやアンチエイリアスのかかった縁が細い帯に分かれ、帯の1本1本がまた別の輪郭になります。
- 正確さを優先する設定：ピクセル1つ1つにぴったり沿うトレースでは、ピクセルの段差がすべてポイントとして残ります。
少ないポイントでなめらかにトレースする手順
- 手元にあるいちばん大きく、きれいな画像から始めます。くっきりしたPNGのほうが、小さく圧縮されたJPGよりもポイントが少なくトレースできます。
- 上の変換ツールで画像を開き、パスとアンカーポイントを表示をオンにして、結果のポイントを確認します。
- 「色」では、パレットでデザインに本当にある色の数だけを設定します。圧縮で残った中間の色は、余分な図形にならずに最も近い色にまとまります。
- 「図形」では、最小図形サイズを上げて小さな点を消し、細かいディテールが不要なら複雑さを図形を少なくの方向に動かします。
- 「パス」では、アンカーポイントを少なくの方向に、なめらかさをなめらかな曲線の方向に動かします。ロゴや文字では角をシャープにをオンのままにして、とがった部分をくっきり保ちます。
- 比較表示で元画像と見比べてから、SVGでダウンロードします。
できあがったSVGをInkscapeやIllustratorで単純化する
元の画像がなくSVGしかない場合でも、主要な編集ソフトなら選択したパスのポイントを減らせます。Inkscapeでは「パス＞簡略化」、Illustratorでは「オブジェクト＞パス＞単純化」で、Illustratorではスライダーでどこまで減らすかを調整できます。
単純化は今ある曲線をもとに処理するので、本物の角とピクセルの段差を見分けられません。角が丸まり、細い部分がやせ、小さな点はそのまま残りがちです。少しずつ控えめに使いましょう。元の画像が残っているなら、なめらかな設定でトレースし直すほうが、ノイズだらけのトレース結果を単純化するよりたいていきれいに仕上がります。
アンカーポイントはいくつくらいが普通？
デザインによって違うので、決まった数はありません。参考までに、ロゴ、国旗、絵文字、アイコン、線画の30枚で行ったベンチマークでは、Shapesodaの初期設定でのポイント数は1枚あたり中央値96個（平均174個）でした。同じ画像で比べたほかのツールの中央値は156〜406個でした。シンプルなアイコンなら必要なポイントは数十個で、数千個ではありません。2色のロゴが数千個のポイントで返ってくるなら、トレースがピクセルをたどっています。
カッティングマシンやレーザーにはポイントを少なく
Cricut、シルエット、レーザーでは、ポイントの数が仕上がりに表れます。何百もの細かい線分を刃が引きずると、曲がり角のたびに薄いカッティングシートが破れることがありますし、減速と加速を繰り返すレーザーは、遅くなった場所に濃い焦げを残すことがあります。マシンに送る前に、パスとアンカーポイントを表示でファイルを開き、カットする曲線を見てみましょう。理想は、ポイントが間隔をあけて並んだ、長く均一な曲線です。ゆるやかなカーブにポイントが密集していたら、ポイントを少なくしてトレースし直すサインです。DXFは例外で、曲線は短い直線のつながりとして保存されます。その本数はDXFの曲線で設定します。ファイルを軽くするなら線を少なく（軽量）、曲線を完全に丸く見せたいなら線を多く（なめらか）を選びます。
ノイズの多いトレースのそのほかのサイン
- 本来1色の面に何百もの小さな図形がある：パレットの色を減らすか、最小図形サイズを上げます。
- 色と色の間に細いすき間がある：印刷やWeb用なら、図形を重ね合わせ（すき間なし）に切り替えます。
- レーザーソフトで線が二重になる：LightBurnのトレースで線が二重になる原因をご覧ください。
- IllustratorやInkscapeでのトレースが粗い：Illustratorの画像トレースができないときとInkscape「ビットマップのトレース」の設定をご覧ください。
変換だけしたい場合は、画像をSVGに変換、ラスターをベクターに変換、アイコンをSVGに変換をお使いください。
