PNG a SVG tiene que ver con el rastreo y la vectorización de imágenes: la conversión de una imagen rasterizada (jpg/png) a una imagen vectorial (svg).
Si está abrumado por la variedad de opciones, el consenso general es:
Para obtener mejores resultados con imágenes de baja resolución, procéselas previamente con un escalador de imágenes de IA y luego vectorícelas.
Muchas de las aplicaciones que se enumeran a continuación no incluyen versiones de línea de comandos y no son prácticas para alojarlas en línea. Sin embargo, son compatibles con aplicaciones como Keyboard Maestro y AutoHotkey.
Para alojar su propio convertidor en línea, consulte las especificaciones de código abierto y los ejemplos de código a continuación.
¡Siempre estoy buscando más software de vectorización alternativo! Crea un problema de GitHub y lo agregaré a la lista.
El objetivo original de este documento era delinear una especificación para las funciones sin servidor de NodeJS para convertir imágenes rasterizadas a SVG y vincularlas a otros repositorios para implementaciones.
Como tal, el resto del documento sirve como una especificación simple sobre cómo se deben estructurar las solicitudes y respuestas para convertir entre imágenes rasterizadas y SVG. Consulte los repositorios relacionados para conocer las implementaciones de la especificación.
Seguimiento de imágenes
Sin servidor
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> "
}
]
}Para apoyar el desarrollo continuo de este proyecto, considere hacer una donación.
Se aceptan contribuciones.
