PNG から SVG への変換は、画像のトレースとベクトル化、つまりラスター画像 (jpg/png) からベクター画像 (svg) への変換がすべてです。
さまざまなオプションに圧倒されてしまう場合、一般的なコンセンサスは次のとおりです。
低解像度の画像で最良の結果を得るには、AI 画像アップスケーラーで画像を前処理してからベクトル化します。
以下にリストされているアプリの多くにはコマンド ライン バージョンが含まれていないため、オンラインでホストするのは現実的ではありません。ただし、Keyboard Maestro や AutoHotkey などのアプリを使用してスクリプト化できます。
独自のコンバータをオンラインでホストするには、以下のオープンソース仕様とコード例を確認してください。
私は常に、代替のベクトル化ソフトウェアを探しています。 GitHub の問題を作成すると、リストに追加されます。
このドキュメントの当初の目的は、ラスター イメージを SVG に変換し、実装のために他のリポジトリにリンクする NodeJS サーバーレス関数の仕様の概要を説明することでした。
そのため、ドキュメントの残りの部分は、ラスター イメージと SVG の間で変換するためにリクエストとレスポンスをどのように構成するかについての簡単な仕様として機能します。仕様の実装については、関連リポジトリを確認してください。
画像トレース
サーバーレス
function ImageInput ( ) {
const [ files , setFiles ] = React . useState < File [ ] > ( ) ;
const onSubmit = ( event ) => {
event . preventDefault ( ) ;
if ( ! files ?. length ) return ;
async function getSvg ( ) {
try {
const formData = new FormData ( ) ;
files . forEach ( ( file , index ) =>
formData . append ( `image- ${ index } ` , file , file . name )
) ;
const response = await axios . post ( url , formData , {
headers : {
"Content-Type" : "multipart/form-data" ,
} ,
} ) ;
} catch ( error ) {
console . log ( error )
}
}
getSvg ( ) ;
} ;
return (
< form onSubmit = { onSubmit } >
< input
id = "file"
name = "file"
type = "file"
multiple
required
accept = "image/jpeg, image/png, image/webp, image/gif, image/svg+xml, image/heic"
onChange = { ( event ) => {
const files = Array . from ( event . target . files ) ;
if ( files ?. length ) {
setFiles ( files ) ;
}
} }
/ >
< / form >
) ;
}{
"algorithm" : " imagetracerjs " ,
"files" : [
{
"fieldName" : " image-1 " ,
"originalName" : " demo-one.png " ,
"svg" : " <svg>…</svg> "
},
{
"fieldName" : " image-2 " ,
"originalName" : " demo-two.jpg " ,
"svg" : " <svg>…</svg> "
}
]
}このプロジェクトの継続的な発展をサポートするには、寄付を検討してください。
貢献は大歓迎です。
