PerfectVector
작성: Irene Kim

Potrace PNG→SVG 변환: 투명도 처리와 내부 구멍 유지

Potrace로 PNG를 SVG로 바꾸기 전에 회색조 비트맵을 준비하세요. 투명 픽셀은 흰 배경에 합성하고 임계값 처리된 도형과 내부 구멍을 확인한 뒤 변환합니다.

6분 읽기
목차

Potrace로 PNG를 SVG로 변환하려면 먼저 회색조 비트맵을 준비한 뒤 potrace --svg로 트레이싱하세요. 투명 배경에 어두운 그림이 있는 경우 비트맵으로 저장하기 전에 흰 배경 위에 합성합니다. 최종 SVG를 채택하기 전에 임계값으로 나뉜 도형과 내부의 구멍을 확인하세요.

표준 Potrace 1.16은 PNG를 직접 읽는 대신 PBM, PGM, PPM, BMP를 읽습니다. 공식 매뉴얼은 중간 명암이 검정 또는 흰색으로 바뀌는 단색 트레이싱을 설명합니다. 아래 절차는 PNG의 연속적인 알파 값을 유지하는 대신, 빈 영역이 있는 채워진 형상을 만듭니다.

이미 가지고 있는 이미지에 대해 브라우저 작업 흐름을 선호하는 경우 PerfectVector는 이미지-경로 변환 및 무료 미리 보기를 제공합니다. 자신의 이미지로 자유롭게 시작한 다음 실루엣, 작은 구멍 및 색상을 소스와 비교하세요. 편집하거나 내보내기 전에 결과를 잠금 해제하세요. 로컬 Potrace 레시피는 명시적인 전처리 및 반복 가능한 명령 설정을 원할 때 여전히 유용합니다.

내 이미지로 직접 해 보세요
전체 도구 열기
무료로 써 보세요. 이미지를 놓으면 가입 없이 벡터 미리보기를 볼 수 있어요.

트레이싱 전에 필요한 준비

설치된 Potrace 실행 파일, Pillow가 포함된 Python 3 및 원본 PNG를 사용하세요. 이 레시피는 Potrace 1.16 및 Pillow 11.3.0에서 실행되었습니다. 입력의 복사본을 보관하고 별도의 폴더에서 작업하여 각 임계값 변형이 고유한 파일 이름을 갖도록 합니다.

시작 사례는 밝거나 투명한 배경에 어두운 로고, 아이콘 또는 그림입니다. 피사체가 밝고 어두운 경우 이 레시피를 적용하기 전에 이미지를 반전하거나 준비하는 방법을 결정하세요. 대화형 편집기 작업 흐름은 Inkscape Trace Bitmap을 참조하세요.

매트는 트레이싱하기 전에 투명한 픽셀을 해결하는 데 사용되는 단색 배경입니다. 임계값은 준비된 이미지를 전경과 배경으로 나누는 밝기 차단입니다. 이러한 선택은 윤곽선이 SVG 형상이 되기 전에 발생합니다.

1. 비트맵으로 저장하기 전에 투명도 처리하기

PNG는 색상과 불투명도를 별도로 저장합니다. 알파 채널은 각 픽셀의 불투명도를 설명합니다. PNG 사양에서 이 표현을 설명합니다. 완전히 투명한 픽셀은 여전히 RGB 값을 전달할 수 있습니다. 알파 채널을 삭제해도 이미지 뷰어에서 볼 수 있는 흰색 배경에 해당 픽셀이 합성되지 않습니다.

어두운 표시의 경우 의도적으로 흰색 위에 이미지를 배치합니다. 이 Python 스니펫은 artwork.png를 열고 동일한 크기의 흰색 이미지로 합성한 다음 해당 결과를 회색조로 변환하고 artwork.pgm을 저장합니다.

from PIL import Image
 
src = Image.open("artwork.png").convert("RGBA")
matte = Image.new("RGBA", src.size, "white")
gray = Image.alpha_composite(matte, src).convert("L")
gray.save("artwork.pgm")

Pillow의 alpha_composite 문서는 두 번째 이미지가 첫 번째 이미지 위에 합성된 것으로 정의합니다. 여기에 있는 두 이미지 모두 크기와 RGBA 모드가 일치합니다.

트레이싱하기 전에 준비된 PGM을 엽니다. 외부 배경은 흰색이어야 하고 전경은 어두우며 중요한 간격이 보여야 합니다. 이 단계의 검은색 직사각형은 전처리 문제입니다. 나중에 SVG 채우기 규칙을 변경하면 트레이싱 프로그램에 도달하지 않은 구멍를 복구할 수 없습니다.

삽화
흰색 매트에 합성된 후 중앙이 열린 SVG 형상으로 표현된 PNG 투명도의 검정색 링 그림
전경 형상을 선택하기 전에 의도적인 매트에 대해 래스터의 투명한 픽셀을 해결합니다. 마지막 구멍를 통해 디스플레이 배경이 보입니다.

2. 준비한 PGM 트레이싱하기

artwork.pgm이 포함된 폴더에서 이를 실행하세요.

potrace artwork.pgm --svg --blacklevel 0.5 --turdsize 2 --output artwork.svg

--blacklevel 0.5는 회색조 컷오프를 선택합니다. --turdsize 2는 Potrace의 기본 작은 얼룩 억제를 명시적으로 유지합니다. 설정을 변경할 때 새 출력 이름을 사용한 다음 참조를 반복적으로 덮어쓰지 말고 파일을 비교하십시오.

한 번에 하나의 컨트롤을 변경합니다.

제어검토할 내용
--blacklevel희미한 표시가 전경이 되고 좁은 구멍이 비어 있는지 여부
--turdsize작은 고립된 모양이 노이즈인지 아니면 의도적인 세부 사항인지 여부
--alphamax코너 처리; 이름에도 불구하고 이것은 불투명도 제어가 아닙니다.

블랙 레벨 임계값이 높을수록 전경에 더 많은 밝은 회색 픽셀이 포함될 수 있습니다. 희미한 선을 강화하거나 빛의 구멍를 닫을 수 있습니다. 준비된 비트맵과 결과 윤곽선을 함께 판단합니다. 스무딩은 임계값이 채워진 후에는 카운터를 재구성할 수 없습니다.

원본 테스트 이미지 두 개에서 확인한 결과

우리는 두 개의 제어된 256 × 256 PNG를 생성하고 위의 전처리 및 Potrace 명령을 실행했습니다. 하나는 외부와 내부에 투명한 픽셀이 있는 검은색 링이었습니다. 다른 하나는 좁은 회색 카운터가 있는 불투명한 어두운 표시로, 표시 내에 구멍가 있습니다. 생성된 SVG를 렌더러로 검사하고 중심 및 외부 투명도를 확인했습니다.

입력 및 준비관찰된 SVG 결과
투명 링, 회색조 변환 전에 알파가 폐기됨채워진 검은 캔버스; 외부와 의도된 구멍가 전경이 되었습니다.
회색조 변환 전에 흰색으로 합성된 동일한 링외부와 중앙은 비어 있었습니다. 반지는 채워져 있었다
좁은 회색 카운터, 흰색 합성, 블랙레벨 0.5카운터는 계속 열려있었어요
동일한 준비된 카운터 이미지, 블랙레벨 0.8카운터가 꽉 찼어요

링 컨트롤의 보이지 않는 픽셀은 검은색 RGB 값을 전달했습니다. 알파를 무시하면 해당 값이 임계값에 노출됩니다. 흰색 복합 버전은 먼저 흰색으로 해결했습니다. 이는 해당 샘플의 블랙박스를 설명합니다. 모든 PNG가 동일한 방식으로 실패할 것이라는 주장은 아닙니다.

카운터 테스트에서는 입력 및 기타 설정이 일정하게 유지되었습니다. 기준점만 변경되었습니다. 그 결과는 더 어둡게 보이는 트레이스가 자동으로 더 나은 트레이스가 아닌 이유를 보여줍니다. 가장 무거운 실루엣이 있는 설정을 선택하기보다는 필요한 기능을 검사하십시오.

이 결과는 원본 테스트 이미지 두 개를 디지털로 확인한 것이며, SVG 출력에는 삽입된 래스터 이미지가 없었습니다. Potrace와 PerfectVector의 품질을 비교하거나, 파일을 커팅 장비로 불러오거나, 실물 결과를 시험하지는 않았습니다.

3. 저장된 SVG의 구멍과 배경 확인하기

대비되는 배경 위에 SVG를 배치합니다. 해당 배경은 외부 영역과 모든 의도된 구멍를 통해 보여야 합니다. 흰색 페인트는 흰색 페이지의 구멍과 유사할 수 있으므로 썸네일만으로는 부족합니다.

SVG 복합 경로는 한 개체 내의 외부 윤곽선과 내부 구멍를 설명할 수 있습니다. 트레이싱된 형상에 구멍가 이미 없으면 PGM 및 임계값으로 돌아갑니다. 하나의 렌더러에 존재하지만 가져온 후 채워지는 경우 대신 수신 앱의 경로 해석을 조사하세요. SVG 구멍 문제 해결 가이드에서는 이러한 경우를 구분합니다.

저장된 파일에서 다음 사항을 확인하세요.

  • 의도한 실루엣과 작은 틈;
  • 마크 외부와 카운터 내부의 실제 빈 공간;
  • 물체가 되어서는 안되는 길 잃은 얼룩들;
  • 대상 워크플로의 적절한 문서 크기
  • PNG의 포함된 복사본이 아닌 경로입니다.

배경만 이상해 보이는 경우 흰색 개체를 모두 삭제하기 전에 투명 SVG 배경 진단을 사용하세요. 작은 특징이 원본에 전혀 없는 경우 더 큰 원본을 사용하거나 해당 세부 사항을 다시 그립니다. 소스 품질 가이드에 해당 경계가 설명되어 있습니다.

이 흑백 작업 방식이 적합한 경우

포트레이스는 채워진 실루엣과 의도적인 구멍로 표현할 수 있는 마크에 맞습니다. 부드러운 음영 처리나 부분 불투명도가 보존해야 하는 아트워크의 일부인 경우 래스터를 유지하십시오. 여러 가지 의미 있는 색상의 경우 색상 지원 벡터화 워크플로우를 사용하거나 의도적인 별도 패스를 준비하십시오. 이 단일 단색 명령은 색상 팔레트를 생성하지 않습니다.

벡터 편집기를 사용하여 중요한 윤곽을 다시 그릴 수도 있습니다. 자동 트레이싱은 후보 모양을 제공하며 사용 목적에 따라 이를 유지할지 편집할지 여부가 결정됩니다.

FAQ

Potrace가 PNG를 직접 열 수 있나요? 표준 Potrace 1.16은 PBM, PGM, PPM 및 BMP 입력을 허용합니다. 먼저 다른 이미지 도구를 사용하여 PNG를 디코딩하고, 투명도 처리를 명시적으로 만들고, 트레이싱하기 전에 지원되는 비트맵을 저장하세요.

Potrace는 PNG 투명성을 유지합니까? 단색 작업흐름은 채워진 형상과 빈 영역을 만듭니다. PNG의 연속 알파 값은 유지되지 않습니다. 임계값을 지정하기 전에 투명한 픽셀을 의도적인 매트에 합성한 다음 대비되는 배경 위에 SVG의 빈 영역을 확인합니다.

alphamax가 PNG 알파 설정인가요? 아니요. Potrace의 alphamax는 트레이싱된 곡선의 모서리 처리를 제어합니다. 트레이싱 전에 PNG의 불투명도 채널이 합성되는 방식은 결정되지 않습니다.

구멍이 사라진 이유는 무엇인가요? 준비된 비트맵과 선택한 임계값에 구멍가 계속 표시되는지 확인합니다. 임계값이 채워지면 준비 또는 컷오프를 변경하고 되돌립니다. SVG에 오프닝이 포함되어 있지만 수신 앱만 이를 채우는 경우 거기에서 복합 경로 및 채우기 규칙 처리를 확인하세요.

출처

  1. Potrace — 수동 — 지원되는 입력 형식, 흑백 임계값, SVG 출력 및 명명된 명령 옵션.
  2. 베개 — 이미지 모듈 — RGBA 이미지 합성 및 준비 스니펫에 사용되는 순서입니다.
  3. W3C — PNG 사양 — PNG 이미지의 색상 샘플 및 알파 표현.
  4. W3C — SVG 경로 — 구멍를 설명할 수 있는 복합 경로 및 내부 윤곽선입니다.

PerfectVector에서 자신의 이미지로 무료로 시작한 후, 다음 편집 단계를 선택하기 전에 소스와 비교하여 실루엣과 내부 구멍를 확인하세요.

블로그의 다른 글

PerfectVector

이미지를
깔끔하고 편집 가능한 벡터 패스로 바꿔보세요

벡터화와 미리보기 확인은 무료이며 하루 사용 횟수 제한이 없습니다.