PNG 到 SVG 都是關於圖像追蹤和向量化 - 將光柵圖像 (jpg/png) 轉換為向量圖像 (svg)。
如果您對各種選擇感到不知所措,那麼普遍的共識是:
為了獲得低解析度影像的最佳效果,請使用 AI 影像放大器對其進行預處理,然後對其進行向量化。
下面列出的許多應用程式不包含命令列版本,並且無法在線託管。但是,它們可以透過 Keyboard Maestro 和 AutoHotkey 等應用程式編寫腳本。
若要在線上託管您自己的轉換器,請查看下面的開源規格和程式碼範例。
我一直在尋找更多替代向量化軟體!建立一個 GitHub 問題,我會將其新增到清單中。
本文檔的最初目標是概述 NodeJS 無伺服器函數的規範,用於將光柵圖像轉換為 SVG,並連結到其他儲存庫以進行實作。
因此,文件的其餘部分作為一個簡單的規範,說明如何建立請求和回應以在光柵圖像和 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> "
}
]
}
為了支持該項目的持續發展,請考慮捐贈。
歡迎貢獻。