Warstwy PNGtoSVG: usuń kolory i dodaj znaczniki pasowania

Elementy sterujące palety PNGtoSVG pozwalają usunąć wykryty kolor i dodać pasujące znaczniki do geometrii kolorów. Zapisz wynik po każdej zmianie i sprawdź wyeksportowany plik SVG. Licznik ścieżek interfejsu i liczba elementów ścieżki SVG mogą opisywać różne rzeczy, więc żadna liczba nie mówi, ile masz przydatnych elementów rzemiosła.

Ten przepływ pracy wykorzystuje witrynę PNGtoSVG.com, której bieżący interfejs zawiera oddzielny link klasyczny. Śledzi jedno źródło poprzez linię bazową, usuwanie bieli i eksport znaku rejestracyjnego. Rezultatem jest sprawdzony plik SVG; import maszyn i osiowanie materiałów nadal wymagają własnego testu.

Wypróbuj na własnym obrazie

Otwórz pełne narzędzie

PNGJPGWEBPPNGSVGUpuść tu swój obrazlub kliknij · wklej ⌘VWybierz obrazUpuść, aby sprawdzić obraz

Za darmo i bez rejestracji: upuść obraz, aby zobaczyć podgląd swojego wektora.

Wybierz kolory, które chcesz zachować

Potrzebujesz dozwolonego obrazu rastrowego, zachowanego oryginału i oddzielnych nazw plików do eksportu. Zdecyduj, czy biały jest niechcianym tłem, zamierzoną białą grafiką, czy jednym i drugim. Paleta to zestaw kolorów w śladzie; usunięcie jednego koloru może mieć wpływ na każdy region przypisany do tego wypełnienia.

Naszą oryginalną kontrolą był 384 × 256 RGB PNG na nieprzezroczystym białym tle. Miał granatową ramkę z białym środkiem, turkusowy trójkąt, złoty prostokąt i dwa małe granatowe kwadraty. Wykorzystaliśmy go ponownie w niezmienionej formie i przetestowaliśmy działającą witrynę 8, 2026. Witryna wyświetliła ostrzeżenie o niskiej rozdzielczości dla tego źródła, co jest widoczne na zrzucie ekranu poniżej.

Metoda: zachowaliśmy trzy rzeczywiste eksporty SVG i porównaliśmy ich format XML, wypełnienia i granice dokumentów. To jest jedna mała kontrola geometryczna, a nie benchmark jakości fotograficznej, porównanie PerfectVector czy test importu/cięcia Cricut.

Zapisz linię bazową, a następnie usuń biały kolor z palety

1. Otwórz PNGtoSVG.com i użyj funkcji przeglądaj pliki, aby wybrać źródło. Zamiast polegać na widoku oryginalnego obrazu, poczekaj na wynik wektorowy.
2. Zachowaj automatyczny wynik początkowy do pierwszego porównania. W naszym uruchomieniu wykorzystaliśmy logo/kliparty, wysokie, kolory 10, detale 84, wygładzenie 0, plamkę 5 i narożnik 45; wykryta paleta zawierała cztery kolory. Są to zapisane ustawienia testowe, a nie zalecane ustawienia wstępne dla każdego obrazu.
3. Pozostaw znaki rejestracyjne wyłączone i użyj opcji Download, aby zapisać plik baseline.svg.
4. Znajdź wpis białej palety i wybierz opcję usuwania ×. Poczekaj na aktualizację wyniku, a następnie zapisz osobny plik white-removed.svg.
5. Porównaj zapisany wynik z oryginałem, zwłaszcza z zamierzonymi białymi szczegółami i małymi, pojedynczymi znakami.

W najczęściej zadawanych pytaniach dotyczących palet PNGtoSVG opisano, że × usuwa ścieżki kolorów. Potraktuj to jako zmianę geometrii, a nie po prostu malowanie bieli na inny kolor. Jeśli w Twoim projekcie występują białe litery lub białe podkreślenia, sprawdź je przed pozostawieniem tego wariantu.

W zapisanej linii bazowej cztery elementy ścieżki miały cztery kolory wypełnienia, w tym biały. Po usunięciu bieli SVG miał trzy elementy ścieżki i nie miał białego wypełnienia. W porównaniu z witryną internetową środek granatowej ramki prześwitywał przez szachownicę, podczas gdy środek oryginału pozostał biały.

Jeśli po usunięciu utracisz pożądaną grafikę, przywróć kolor lub załaduj ponownie oryginał i odbuduj z zapisanej linii bazowej. Nie zmieniaj palety na skutek, który już pomija ważny szczegół.

Zapoznaj się ze ścieżkami kolorów przed policzeniem warstw

Wyświetlony interfejs 11 ścieżki dla naszej linii bazowej, ale pobrany plik SVG zawierał cztery <path> elementy. Po usunięciu bieli wyświetlił się interfejs 5 ścieżki, podczas gdy plik zawierał trzy elementy ścieżki.

Ścieżka złożona to jeden element ścieżki zawierający wiele podścieżek. SVG wyraźnie dopuszcza tę konstrukcję, włączając oddzielne kontury i otwory wewnętrzne w jednym elemencie. Specyfikacja ścieżki SVG wyjaśnia tę relację. W tym eksporcie geometria z tym samym wypełnieniem miała wspólny element ścieżki, więc liczba elementów XML nie była zgodna z licznikiem interfejsu.

Użyj licznika, aby śledzić podgląd narzędzia, a następnie sprawdź, jak aplikacja docelowa prezentuje zapisaną geometrię. Ścieżka kolorów może zawierać kilka odłączonych elementów. Nie dowodzi to nazwanej warstwy edytora dla każdego obiektu wizualnego i nie dowodzi, że małe elementy będą łatwe do wycięcia lub umieszczenia.

Na potrzeby następnego etapu przygotowań nasz warstwowy przewodnik SVG oddziela organizację kolorów od projektu gotowego maszynowo. Jeśli potrzebujesz jednego pliku na kolor, zobacz jak rozdzielać kolory SVG na pliki.

Dodawaj znaki rejestracyjne tylko wtedy, gdy potrzebujesz pomocy w ustawianiu

Często zadawane pytania PNGtoSVG opisują jego znaczniki jako pasującą geometrię narożników dodaną do każdej warstwy koloru. Są to pomoce do wyrównywania kolorowej grafiki. Nie zostały tutaj sprawdzone jako ślady czujnika Cricut Print then Cut lub jako substytut własnego przepływu pracy drukowania i cięcia w Twojej maszynie.

Gdy biały kolor jest nadal usunięty, włącz znaki rejestracyjne i zapisz trzeci plik SVG jako white-removed-registration-marks.svg. Zamiast nadpisywać ten plik, porównaj go z nieoznaczonym eksportem.

Nasz zaznaczony eksport nadal miał trzy elementy ścieżki. Każda ścieżka kolorów zawierała w rogach te same cztery 8 × 8 kwadratowe ścieżki podrzędne. Znaki rozszerzyły swój viewBox z 0 0 384 256 do -20 -20 424 296; jego szerokość i wysokość również uległy zmianie z 384 × 256 na 424 × 296.

viewBox opisuje obszar współrzędnych SVG używany w rysunku. W tym przykładzie większe granice obejmują geometrię poza oryginalnym obszarem obrazu. Należy pamiętać o tej różnicy przy porównywaniu wymiarów dokumentu. Nie oznacza to, że centralna grafika została przeskalowana do nowego rozmiaru fizycznego.

W plikach tych weryfikowana jest zgodna geometria kwadratu. Nie testowano skutecznego dopasowania rzeczywistego materiału. Zachowaj niezaznaczoną kopię i w aplikacji docelowej zdecyduj, czy dodatkowe kształty należą do przygotowywanej operacji.

Sprawdź zapisany plik przed wykonaniem projektu rękodzielniczego

Otwórz zaakceptowany plik SVG niezależnie od podglądu witryny. Sprawdź, czy pozostały zamierzone kolory, usunięcie bieli nie powoduje usunięcia pożądanej grafiki, a oddzielne elementy koloru nadal zajmują oczekiwane pozycje. Jeśli znaczniki są włączone, sprawdź wszystkie cztery rogi i krawędzie nowego dokumentu.

W przypadku cięcia pozostałe elementy należy sprawdzić w aplikacji odbiorczej: wymiary fizyczne, drobne szczegóły, przypisanie kolorów i operacja zastosowana do pomocy w ustawianiu. Przed powtórzeniem projektu przeprowadź mały test materiałowy. Pomyślne pobranie przeglądarki nie kończy tych kroków.

Przewodnik po wyborze konwertera Cricut obejmuje inne trasy początkowe. Pozostań przy PNGtoSVG, gdy sterowanie paletą i zapisana geometria spełnią Twoje zadanie. Użyj innego śledzenia lub edycji ręcznej, jeśli po ograniczonym teście ważne regiony pozostają niewygodne.

Kiedy automatyczne śledzenie jest kolejnym przydatnym krokiem

PerfectVector sprawdza się, gdy chcesz zacząć od oryginalnego rastra i sprawdzić automatyczny ślad przed przygotowaniem rzemiosła. Użyj strony SVG dla Cricut z własnym obrazem, a następnie sprawdź najmniejszy wymagany element, otwory wewnętrzne i każdy obszar kolorów. Jest to osobna opcja śledzenia, a nie twierdzenie, że w tym teście jej dane wyjściowe zostały zmierzone względem PNGtoSVG.

fakty dotyczące produktu PerfectVector opisują bezpłatny podgląd przeznaczony tylko do przeglądania; musisz odblokować wynik, zanim będziesz mógł go edytować lub wyeksportować. Wynikowy plik nadal wymaga sprawdzenia w aplikacji odbierającej. Jeśli masz już akceptowalną geometrię, jej odtworzenie nie wymaga dodatkowego etapu przygotowawczego.

Często zadawane pytania

Dlaczego interfejs pokazał więcej ścieżek niż zawarty plik SVG? Nasze zapisane ścieżki kolorów zawierały wiele podścieżek, więc jeden element ścieżki SVG mógł zawierać kilka oddzielnych konturów. Licznik interfejsu nie był liczbą elementów ścieżki XML ani liczbą znaczących elementów rzemiosła.

Czy usunięcie bieli powoduje jedynie zmianę koloru tła? Nie. PNGtoSVG opisuje kontrolkę × jako usuwającą ścieżki tego koloru. Przed zaakceptowaniem wyniku sprawdź białą grafikę oraz tło zewnętrzne.

Czy te ślady to ślady czujnika Cricut Print and Cut? Ten test potwierdza obecność zgodnych kwadratów pozycjonujących w wyeksportowanych ścieżkach kolorów. Nie potwierdza kompatybilności z procedurą znaczników odczytywanych przez czujniki Cricut, ponieważ jej tutaj nie zweryfikowano. Przed produkcją sprawdź instrukcje aplikacji docelowej i zamierzoną operację.

Źródła

1. PNGtoSVG — wektoryzator obrazu i często zadawane pytania — usunięcie bieżącej palety, opis znaku rejestracyjnego i rzeczywisty interfejs używany w tym teście.
2. W3C — SVG 2 ścieżki — Do jednego elementu ścieżki może należeć wiele podścieżek.
3. W3C — SVG 2 układy współrzędnych — rozróżnienie pola widoku i obszaru współrzędnych używane do opisu zaznaczonego eksportu.
4. PerfectVector — Informacje o produkcie — Bezpłatny podgląd i odblokowana granica edycji/eksportu.

Zacznij od własnego obrazu w PerfectVector, a następnie sprawdź jego kolory, otwory i najmniejsze elementy, zanim przygotujesz projekt w swojej aplikacji do rękodzieła.