PerfectVector
Autor: Irene Kim

VTracer: PNG do SVG, kontrola kolorów i drobnych detali

Konwertuj plik PNG za pomocą testowanego interfejsu CLI VTracer, porównaj ustawienia palety i plamek oraz sprawdź, które kolory i małe obszary pozostają w faktycznie zapisanym SVG.

8 min czytania
Na tej stronie

W przypadku przepływu pracy VTracer w formacie PNG do SVG zapisz ślad linii bazowej przed redukcją kolorów lub filtrowaniem małych obszarów. Następnie zmieniaj po jednym formancie i sprawdzaj każdy zapisany plik SVG. W naszym oryginalnym teście płaskich kolorów ograniczenie kolorów połączyło ważne obszary, podczas gdy silniejszy filtr plamkowy spowodował zniknięcie zamierzonych małych śladów. Najmniejszy plik lub najkrótsza paleta nie był plikiem, w którym zachowała się zamierzona grafika.

Jeśli potrzebujesz jednego pliku PNG prześledzonego online, zacznij bezpłatnie od PerfectVector i porównaj obszary kolorów podglądu i drobne szczegóły z oryginałem. Musisz odblokować wynik, zanim będziesz mógł go edytować lub wyeksportować. Poniższe polecenia pozostają kompletnym lokalnym przepływem pracy VTracer; nie przeprowadzono porównania jakości wyjściowej pomiędzy narzędziami.

Wypróbuj na własnym obrazie
Otwórz pełne narzędzie
Za darmo i bez rejestracji: upuść obraz, aby zobaczyć podgląd swojego wektora.

Dopasuj polecenia do zainstalowanego CLI

W tej instrukcji wykorzystano oficjalny VTracer 1.0.0-alpha.4 CLI z własną wykonywalną pomocą. Pobierz plik binarny odpowiedniej platformy z oficjalnej wersji. W przykładach założono, że plik wykonywalny ma nazwę vtracer w folderze roboczym, obok dozwolonej kopii pliku PNG o nazwie artwork.png.

Potrzebujesz także terminala i przeglądarki SVG lub edytora zwykłego tekstu. Zachowaj nietknięty plik PNG i użyj odrębnych nazw plików wyjściowych. Sprawdź rzeczywisty plik binarny przed śledzeniem:

./vtracer --version
./vtracer --help

Nasze polecenie wersji zwróciło vtracer 1.0.0-alpha.4. Jeśli w Twojej pomocy nie wymieniono poniżej flagi, skorzystaj z dokumentacji zainstalowanego interfejsu. Pakiet Pythona to osobny interfejs; Argumenty słów kluczowych w języku Python i flagi CLI nie są wymienne.

oficjalna dokumentacja projektu opisuje śledzenie kolorów, sterowanie paletami i interfejs CLI. W tym artykule wykorzystano ten lokalny plik wykonywalny, zamiast raportować test wersji demonstracyjnej przeglądarki lub powiązanie z językiem Python.

1. Zapisz linię bazową, która zawiera celowe małe znaki

Zacznij od prostego śladu, z którym możesz później porównać:

./vtracer artwork.png baseline.svg \
  --mode polygon --color-precision 8 --filter-speckle 0

Użyliśmy dopasowania wielokątnego, ponieważ nasz kontrolowany obraz zawiera obszary o prostych krawędziach. Jest to punkt odniesienia dla tej płaskiej grafiki, a nie uniwersalne ustawienie dla każdej fotografii lub zakrzywionej ilustracji.

Trzy nazwane opcje odpowiadają na różne pytania:

OpcjaCo kontrolujeCo sprawdzić
--mode polygonWybrany tryb dopasowywania krzywejCzy powstałe kontury odpowiadają źródłu
--color-precision 8Znaczące bity na kanał RGBCzy zamierzone kolory pozostają rozróżnialne
--filter-speckle 0Ustawienie filtrowania małych fragmentówCzy pożądane małe znaki przetrwają linię bazową

Otwórz plik baseline.svg obok pliku PNG. Przed zmianą ustawień zidentyfikuj kilka krytycznych obszarów: kolor marki, mały izolowany akcent, cienki element lub przerwę oddzielającą dwa kształty. Gładka, duża sylwetka może ukryć utratę któregokolwiek z nich.

Ilustracja
Próbki palety koncepcyjnej i kolorowe kształty obok lupy sprawdzającej drobne szczegóły akcentujące
Sprawdź oddzielnie zamierzone kolory i drobne szczegóły, a następnie sprawdź oba ponownie po każdej zmianie.

2. Porównaj limit kolorów ze stałą paletą

Testowany CLI oferuje --max-colors dla górnego limitu kolorów i --palette dla dostarczonych kolorów szesnastkowych. paleta to zestaw kolorów, których chcesz użyć w grafice. Zdecyduj, które kolory muszą pozostać inne, zanim poprosisz znacznika o ich zmniejszenie.

W tym wariancie opcje bazowe pozostają niezmienne i dodaje ograniczenie trzech kolorów:

./vtracer artwork.png fewer-colors.svg \
  --mode polygon --color-precision 8 --filter-speckle 0 \
  --max-colors 3

Górna granica nie gwarantuje dokładnie tylu widocznych kolorów. Nasz rzeczywisty wynik miał tylko dwie unikalne wartości pełnego wypełnienia, w tym kolor biały. Obszary granatowy i turkusowy uzyskały ten sam stonowany kolor, a obszar złoty nie był już odróżnialny od białego tła.

Jeśli masz już zamierzoną paletę, przetestuj dostarczone kolory:

./vtracer artwork.png fixed-palette.svg \
  --mode polygon --color-precision 8 --filter-speckle 0 \
  --palette '#ffffff,#17324d,#298d83,#d49c32'

Naszym źródłem złota było #e7b64c; w tej dostarczonej palecie użyto #d49c32 na swoim miejscu. Uratowany SVG wykorzystał to nowe złoto, zachowując wymieniony kolor granatowy, turkusowy i biały. Był to celowy wybór zmiany koloru, a nie zachowanie oryginalnej palety. Aby podjąć bardziej szczegółowe decyzje dotyczące tego, które kolory można łączyć bez utraty znaczenia, skorzystaj z przewodnika po redukcji palety SVG.

3. Przetestuj filtrowanie małych regionów na osobnej kopii

Wróć do opcji bazowych, a następnie zmień tylko filtr plamek:

./vtracer artwork.png filtered.svg \
  --mode polygon --color-precision 8 --filter-speckle 8

Plamki to małe, odizolowane obszary, które mogą być niepożądanym szumem lub celowym dziełem sztuki. Sam ich rozmiar nie mówi Ci, który. W naszym pliku testowym zarówno izolowane granatowe znaki 2 × 2, jak i 8 × 8 były widoczne w linii bazowej i zniknęły w tym filtrowanym wariancie.

Traktuj wartość flagi jako ustawienie do sprawdzenia w pliku, a nie obietnicę, że znacznik o tej samej szerokości numerycznej przetrwa. Porównaj zapisane dane wyjściowe w zamierzonym rozmiarze, a następnie powiększ określone znaczniki, które miałeś zachować. Jeśli pożądany szczegół zniknie, obniż filtr i wróć do oryginalnego pliku PNG.

Sprawdź także kolory. Nasz filtrowany SVG wprowadził #fefefe obok koloru białego. Ta obserwacja jest powodem do sprawdzenia rzeczywistej palety wyjściowej po zmianie szczegółów, zamiast zakładać, że jedno ustawienie wpływa tylko na właściwość wymienioną we fladze.

Co pokazały cztery faktycznie zapisane pliki

Stworzyliśmy oryginalny plik PNG 384 × 256 z białym tłem, granatową ramką z białym środkiem, turkusowym trójkątem, złotym prostokątem i dwoma izolowanymi granatowymi kwadratami. Wszystkie cztery konwersje wykorzystywały ten sam tryb wejściowy i wielokątny. Tabela przedstawia rzeczywiste znaczniki SVG i niezależne renderowania, a nie edytor docelowy lub test fizyczny.

WyjścieUnikalne, pełne wypełnienia, łącznie z tłemMałe znaki 2 × 2 i 8 × 8Główna obserwacja
baseline.svgCzteryObydwa widoczneW tym dokumencie referencyjnym zachowano oryginalne, jednolite kolory
fewer-colors.svgDwaObydwa widoczne w połączonym kolorzePołączenie granatu i turkusu; region złoty odczytywany jako biały
filtered.svgPięćŻadne widoczneUtracono małe znaki; wprowadzono prawie białe wypełnienie
fixed-palette.svgCzteryObydwa widoczneZłoto zmienione na dostarczony #d49c32

Wszystkie cztery pliki SVG zawierały ścieżki i nie zawierały elementu obrazu. Fakty te potwierdzają faktyczne śledzenie w tych plikach, ale nie oceniają konturów ani nie świadczą o pomyślnej edycji w innej aplikacji. Środek białej ramki i tło w tym eksperymencie są nieprzezroczyste; to nie jest test przezroczystości PNG.

W przypadku oryginalnych kolorów i zamierzonych znaków tego pliku testowego zachowalibyśmy linię bazową. Wariant ze stałą paletą pasuje do osobnego zadania polegającego na celowej wymianie złota. Pliki o zmniejszonych kolorach i filtrowane nie spełniają tych szczególnych wymagań dotyczących przechowywania. Żadna z tych opcji nie ustanawia uniwersalnego najlepszego ustawienia wstępnego ani porównania z innym znacznikiem.

Wybierz plik, który możesz wyjaśnić

Przed zapisaniem pliku SVG zapisz jego dane wejściowe, wersję wykonywalną, pełne polecenie i uzasadnienie swojego wyboru. Sprawdź paletę według roli, najmniejszych wymaganych obszarów, szczelin i konturów. Następnie otwórz go w rzeczywistym miejscu docelowym i spróbuj edytować lub zaimportować wymagane przez Ciebie zadanie; ten późniejszy etap nie był częścią tego testu.

Nieudana kontrolaNastępna akcja
Ważne kolory łączą sięPodnieś lub usuń limit kolorów lub uzupełnij zamierzoną paletę
Drobne akcenty znikająPorównaj z linią bazową o niskim filtrze i odtwórz przy niższym ustawieniu plamki
Nieoczekiwanie pojawiają się białe lub prawie białe wypełnieniaPrzed usunięciem sprawdź faktycznie zapisane wypełnienia i ich widoczne obszary
Polecenie odrzuca flagęPrzeczytaj wersję/pomoc tego pliku binarnego i dopasuj jego dokumentację CLI
Ślad nadal nie spełnia krytycznego konturuPonownie odwiedź źródło lub przerysuj tę funkcję celowo

karta wyników jakości śledzenia zapewnia kontrolę konturu, możliwości edycji i miejsca docelowego wykraczającą poza ten eksperyment z paletą/szczegółami. W przypadku wyraźnie monochromatycznego przepływu pracy przewodnik Potrace PNG do SVG opisuje inne zadanie śledzenia.

Zachowaj oryginał i zaakceptowany plik SVG razem. Jeśli chcesz wypróbować ten sam plik PNG online, zacznij bezpłatnie od PerfectVector i sprawdź zamierzone kolory podglądu i najmniejsze wymagane szczegóły w porównaniu ze źródłem.

Często zadawane pytania

Czy VTracer może konwertować kolorowy plik PNG na rzeczywiste ścieżki SVG?

Tak. Wszystkie cztery pliki w naszym testowanym przepływie pracy CLI zawierały ścieżki i nie zawierały żadnego elementu obrazu. Użyteczny wynik nadal zależał od tego, jakie kolory i małe obszary pozostały po wybranych ustawieniach.

Czy max-colors 3 gwarantuje dokładnie trzy kolory?

Nie. Ustala górną granicę. W naszym teście referencyjnym uzyskaliśmy dwa unikalne, pełne wypełnienia, w tym białe, i utraciliśmy ważne rozróżnienia kolorów. Sprawdź faktycznie zapisaną paletę, a nie sam żądany numer.

Dlaczego po filtrowaniu zniknęły małe znaki?

Ustawienie plamek może spowodować odrzucenie małych obszarów. Obydwa zamierzone kwadraty w naszym teście zniknęły w miejscu filtru 8. Porównaj z linią bazową o niskim filtrze i obniż ustawienie, jeśli Twoja grafika potrzebuje tych regionów.

Czy mogę wkleić te flagi do przykładu VTracer w języku Python?

Użyj interfejsu i wersji, którą zainstalowałeś. W tym przewodniku przetestowano plik wykonywalny 1.0.0-alpha.4 i jego pomoc CLI. Przykłady powiązań w języku Python używają własnych argumentów funkcji i dokumentacji.

Źródła

  1. Oficjalny projekt VTracer — śledzenie kolorów, użycie CLI i opcje palety/szczegółów.
  2. VTracer 1.0.0-alpha.4 wydanie — plik wykonywalny z przypiętą wersją, używany w tym przepływie pracy.
  3. Pakiet Pythona VTracer — oddzielny interfejs wiązania Pythona, odróżniający się od testowanego CLI.

Więcej z bloga

PerfectVector

Zamień obraz w
czyste, edytowalne ścieżki wektorowe

Wektoryzuj i sprawdzaj podgląd za darmo, bez dziennego limitu.