Rastergrafik in Vektorgrafik konvertieren

Für zum Beispiel T-shirtdruck oder zum Erzeugen von Logos sind sehr oft SVG-Dateien notwendig. Doch meist liegen Grafiken in Rasterformaten wie PNG oder JPEG vor. Jetzt bleibt entweder der Weg die Grafik als SVG mit adäquaten Werkzeugen nach zu bauen oder der einfachere Weg die Rastergrafik in eine SVG-Grafik zu konvertieren.

Der von mir bevorzugte Weg stellt eine Voraussetzung an die Rastergrafik. Sie muss, zumindest nach meiner Erfahrung, um den Prozess nicht zu langwierig zu machen, aus einer diskreten, menschenhandhabbaren Anzahl von Farbtönen bestehen, zB aus 16 Farben ohne Verläufe. Zur Erzeugen der SVGs sollten zumindest ein Bildbearbeitungsprogramm wie Gimp oder Imagemagick, ein Konvertierungsprogramm wie Potrace und ein Programm zur Bearbeitung der SVGs wie Inkscape installiert sein.

Die Schritte von Raster- zu Vektorgrafik

Raster in SVG umwandeln

Layer für potrace inklusive Vorlage und Ergebnis

  • Zuerst ist das Bild in seine Farben zu zerlegen. Dh nicht in seine Farbkanäle sondern in alle diskreten Farben und danach als einzelne Rastergrafiken zB testbild_$FARBE.png zu speichern. Nach diesem Schritt sollten dann der Anzahl der diskreten Farben entsprechend einzelne Bilder mit weiß als Hintergrundfarbe und zur einfacheren Weiterberabeitung Schwarz als Vordergrundfarbe vorliegen.
  • Jetzt werden alle einzelnen Bilder mit Potrace-gui durch Wahl eines geeigneten Schwellwertes in Pfade für das gewünschte Dateiformat umgewandelt. Die Gui von Potrace sollte eigentlich selbsterklärend sein, trotzdem einfach den Schwellwert für das Format EPS richtig Wählen, denn für EPS gibt es in Potrace eine Vorschau, danach das Format auf SVG ändern, vektorisieren und das Ergebnis als SVG speichern. Diesen Schritt für alle Dateien wiederholen.
  • Danach die einzelnen Pfade zB mit Inkscape wieder zu einem Bild vereinigen und nötigenfalls, wenn Lücken durch die Konvertierungsalgorithmus oder Farbwahl entstanden sind, sind diese noch zu beseitigen.

Nach diesen Schritten sollte die Grafik als SVG vorliegen. Sicherlich wäre es denkbar dae Ausgangsbild gleich in Potrace zu importieren und umzuwandeln, jedoch funktioniert dies nur mit sehr einfachen Bildern bzw wenn nur sehr wenige Farbetöne in diesen vorhanden sind. In jedem anderen Fall funktioniert die von mir vorgestellte Methode schneller, den das Finden des geeigneten Schwellwertes bzw der nötigen Schwellwerte bei mehreren Farben kann sonst recht zeitraubend werden und das Zusammenfügen erspart man sich erst nicht.

Es ist auch denkbar das Ausfüllen der Lücken, so ein Negativpfad zu den Lücken vorhanden ist, nicht mit Potrace und Inkscape sondern lediglich, mit einem generierten Pfad, in Inkscape zu erledigen. So würden sicher keine Spalten zwischen Farben entstehen.

Zu guter letzt noch eine Bemerkung zum auf der Seite dargestellten Endergebnis. Dieses ist nicht direkt mit Inkscape entstanden, sondern die SVG wurde mit Inkscape in POVRay Splines umgewandelt und dann wurde die entstandene Datei in eine POVRayquelldatei inkludiert. Dazu ein andertmal mehr.