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> "
}
]
}为了支持该项目的持续发展，请考虑捐赠。
欢迎贡献。
