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> "
}
]
}이 프로젝트의 지속적인 발전을 지원하려면 기부를 고려해 보세요.
기여를 환영합니다.
