Potrace de PNG para SVG: mantenha o alfa e os vazados

Para converter um PNG em SVG com Potrace, prepare primeiro um bitmap em escala de cinza e depois trace-o com potrace --svg. Para arte escura em pixels transparentes, componha a imagem em um fosco branco antes de salvar o bitmap. Inspecione as formas com limites e suas aberturas internas antes de aceitar o SVG.

O Potrace padrão 1.16 lê PBM, PGM, PPM e BMP em vez de PNG diretamente. Seu manual oficial descreve uma operação de traçado monocromático: tons intermediários tornam-se preto ou branco. O fluxo de trabalho abaixo cria geometria sólida com regiões vazias, em vez de preservar os valores alfa contínuos do PNG.

Se você preferir um fluxo de trabalho de navegador para uma imagem que já possui, o PerfectVector oferece conversão de imagem em caminho e uma visualização gratuita. Comece gratuitamente com sua própria imagem e compare sua silhueta, pequenas aberturas e cores com a fonte. Desbloqueie o resultado antes de editar ou exportar. A receita local do Potrace permanece útil quando você deseja pré-processamento explícito e configurações de comando repetíveis.

Experimente com a sua própria imagem

Abrir a ferramenta completa

PNGJPGWEBPPNGSVGSolte sua imagem aquiou clique · cole ⌘VSelecionar imagemSolte para verificar a imagem

Teste grátis. Solte uma imagem e veja a prévia do seu vetor, sem precisar criar conta.

O que você precisa antes de rastrear

Use um executável Potrace instalado, Python 3 com Pillow, e o PNG original. Esta receita foi exercitada com Potrace 1.16 e Pillow 11.3.0. Mantenha uma cópia da entrada e trabalhe em uma pasta separada para que cada variante de limite tenha um nome de arquivo distinto.

O caso inicial é um logotipo, ícone ou desenho escuro em um fundo claro ou transparente. Se o seu assunto for claro ou escuro, decida como inverter ou preparar a imagem antes de aplicar esta receita. Para um fluxo de trabalho de editor interativo, consulte Inkscape Trace Bitmap.

Um matte é o fundo sólido usado para resolver pixels transparentes antes do rastreamento. Um limiar é o corte de brilho que divide a imagem preparada em primeiro plano e fundo. Essas escolhas acontecem antes do contorno se tornar uma geometria SVG.

1. Resolva a transparência antes de salvar o bitmap

PNG armazena cor e opacidade separadamente. O canal alfa descreve a opacidade de cada pixel. A especificação PNG explica esta representação; um pixel totalmente transparente ainda pode carregar valores RGB. A eliminação do canal alfa não compõe esses pixels no fundo branco que você pode ter visto em um visualizador de imagens.

Para uma marca escura, coloque a imagem deliberadamente sobre o branco. Este trecho Python abre artwork.png, compõe-no em uma imagem branca de tamanho igual, converte o resultado em escala de cinza e salva 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")

A alpha_composite documentação do Pillow define a segunda imagem como composta sobre a primeira. Ambas as imagens aqui têm dimensões correspondentes e modo RGBA.

Abra o PGM preparado antes de traçar. Seu fundo externo deve ser branco, o primeiro plano pretendido escuro e suas lacunas importantes visíveis. Um retângulo preto neste estágio é um problema de pré-processamento; alterar as regras de preenchimento SVG posteriormente não pode recuperar uma abertura que nunca atingiu o rastreador.

Ilustração

2. Rastreie o PGM preparado

Execute isto na pasta que contém artwork.pgm:

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

--blacklevel 0.5 escolhe o corte da escala de cinza. --turdsize 2 mantém explícita a supressão de pequenas manchas padrão do Potrace. Use um novo nome de saída ao alterar uma configuração e compare os arquivos em vez de substituir repetidamente sua referência.

Altere um controle de cada vez:

Um limite de nível de preto mais alto pode incluir mais pixels cinza claro no primeiro plano. Isso pode fortalecer uma linha tênue ou fechar uma abertura de luz. Julgue o bitmap preparado e o contorno resultante juntos. A suavização não pode reconstruir um contador depois que o limite o preencheu.

O que as duas imagens de teste originais mostraram

Criamos dois PNGs 256 × 256 e executamos os comandos de pré-processamento e Potrace acima. Um deles era um anel preto com pixels transparentes fora e dentro dele. A outra era uma marca escura e opaca com um contador cinza estreito, a abertura fechada dentro da marca. Inspecionamos os SVGs gerados com um renderizador e verificamos sua transparência central e externa.

Os pixels invisíveis do controle de anel carregavam valores RGB pretos. Ignorar alfa expôs esses valores ao limite. A versão composta branca resolveu-os primeiro para branco. Isso explica a caixa preta daquela amostra; não é uma afirmação de que todos os PNG falharão da mesma maneira.

O teste do contador manteve a entrada e outras configurações constantes. Apenas o limite mudou. Seu resultado mostra por que um traço de aparência mais escura não é automaticamente um traço melhor. Inspecione o recurso necessário em vez de escolher a configuração com a silhueta mais pesada.

Estas foram verificações digitais de dois arquivos de teste originais, sem imagem raster incorporada em suas saídas SVG. Não comparamos a qualidade do Potrace's com o PerfectVector, não importamos os arquivos para um cortador ou testamos um resultado físico.

3. Verifique os buracos e o fundo no SVG salvo

Coloque o SVG sobre um fundo contrastante. Esse fundo deve transparecer tanto na área externa quanto em todas as aberturas pretendidas. A tinta branca pode assemelhar-se a um buraco numa página branca, por isso uma miniatura por si só não é suficiente.

Um caminho composto SVG pode descrever um contorno externo e uma abertura interna dentro de um objeto. Se a abertura já estiver ausente na geometria traçada, retorne ao PGM e ao limite. Se existir em um renderizador, mas for preenchido após a importação, investigue a interpretação do caminho do aplicativo receptor. O guia de solução de problemas de furos SVG separa esses casos.

Verifique o arquivo salvo para:

• a silhueta pretendida e pequenos vãos;
• espaço vazio real fora da marca e dentro de seus contadores;
• manchas perdidas que não deveriam se tornar objetos;
• um tamanho de documento apropriado no fluxo de trabalho de destino;
• caminhos em vez de uma cópia incorporada do PNG.

Se apenas o fundo parecer errado, use o diagnóstico de fundo SVG transparente antes de excluir todos os objetos brancos. Se um pequeno recurso estiver realmente ausente da fonte, use um original maior ou redesenhe esse detalhe. O guia de qualidade da fonte explica esse limite.

Quando esse fluxo de trabalho monocromático cabe

Potrace se enquadra em uma marca que pode ser expressa como uma silhueta preenchida e aberturas intencionais. Mantenha o raster quando sombreamento suave ou opacidade parcial fizerem parte do trabalho artístico que você precisa preservar. Para várias cores significativas, use um fluxo de trabalho de vetorização compatível com cores ou prepare passagens separadas deliberadas; este único comando monocromático não cria uma paleta de cores.

Você também pode usar um editor vetorial para redesenhar um contorno crítico. O rastreamento automático fornece uma forma candidata e o uso pretendido determina se ela deve ser mantida ou editada.

Perguntas frequentes

O Potrace pode abrir um PNG diretamente? Potrace padrão 1.16 aceita entrada PBM, PGM, PPM e BMP. Primeiro, decodifique o PNG com outra ferramenta de imagem, torne explícito seu tratamento de transparência e salve um bitmap compatível antes de rastrear.

O Potrace preserva a transparência do PNG? O fluxo de trabalho monocromático cria geometria preenchida e regiões vazias. Ele não preserva os valores alfa contínuos do PNG. Componha pixels transparentes em um fosco deliberado antes do limite e, em seguida, verifique as regiões vazias do SVG sobre um fundo contrastante.

Alphamax é a configuração alfa do PNG? Não. O alphamax do Potrace controla o tratamento dos cantos nas curvas traçadas. Ele não determina como o canal de opacidade de um PNG é composto antes do rastreamento.

Por que um buraco desapareceu? Verifique se a abertura ainda está visível no bitmap preparado e no limite selecionado. Se o limite o preencheu, altere a preparação ou corte e refaça. Se o SVG contiver a abertura, mas apenas um aplicativo receptor a preencher, verifique o caminho composto e o tratamento da regra de preenchimento.

Fontes

1. Potrace — Manual — Formatos de entrada suportados, limite monocromático, saída SVG e opções de comando nomeadas.
2. Pillow — Módulo de imagem — Composição da imagem RGBA e a ordem usada no snippet de preparação.
3. W3C — Especificação PNG — Amostras de cores e representação alfa em imagens PNG.
4. W3C — Caminhos SVG — Caminhos compostos e contornos internos que podem descrever aberturas.

Comece gratuitamente com sua própria imagem no PerfectVector e compare sua silhueta e aberturas internas com a fonte antes de escolher a próxima etapa de edição.