Mit SVG-Filtern in Python arbeiten

Kurzantwort: Um mit SVG-Filtern in Python zu arbeiten, laden Sie das SVG mit SVGDocument, finden das Zielelement mit query_selector(), setzen dessen Attribut filter mit set_attribute() und speichern das SVG.

1from aspose.svg import SVGDocument
2
3with SVGDocument("document.svg") as document:
4    element = document.root_element.query_selector("circle")
5    if element is not None:
6        element.set_attribute("filter", "url(#filter-id)")
7    document.save("filtered.svg")

SVG-Filter erzeugen visuelle Effekte wie Unschärfe, Schatten, Glühen, Beleuchtung und Farbverarbeitung. Ein Filter wird normalerweise in <defs> definiert und über ein Attribut filter="url(#filter-id)" auf ein sichtbares Element angewendet. In Aspose.SVG for Python via .NET arbeiten Sie mit Filtern über das SVG-DOM: Zielelemente finden, Filterprimitive erstellen, Attribute setzen, Knoten anhängen und die bearbeitete Datei speichern.

In diesem Artikel lernen Sie, wie Sie:

einen SVG-Filter für Unschärfe in Python erstellen und auf ein Element anwenden;
einen Schlagschattenfilter mit Filterprimitiven aufbauen;
Filterattribute wie stdDeviation, dx, dy und flood-color bearbeiten;
eine Filterreferenz von einem SVG-Element entfernen, ohne die wiederverwendbare Definition zu löschen.

Grundlagen der SVG-Filterbearbeitung

Ein Filterablauf besteht aus zwei Teilen: der Filterdefinition und der Filterreferenz. Die Definition liegt in <defs>, während das sichtbare Element über eine ID darauf verweist.

Aufgabe	Zu bearbeitendes SVG-Markup	Typisches API-Muster
Vorhandenen Filter anwenden	`filter="url(#filter-id)"`	Sichtbares Element mit `query_selector()` finden und Attribut `filter` setzen
Neuen Filter erstellen	`<defs><filter id="..."></filter></defs>`	SVG-Elemente mit `create_element_ns()` erstellen und mit `append_child()` anhängen
Unschärfe oder Schatten konfigurieren	Attribute von Filterprimitiven wie `stdDeviation`, `dx`, `dy`, `flood-color`	Primitiv finden und Attribute aktualisieren
Effekt entfernen	Attribut `filter` am sichtbaren Element	Filterreferenz mit `remove_attribute()` entfernen

So wenden Sie SVG-Filter in Python an

Verwenden Sie diesen Workflow, wenn eine SVG-Datei Unschärfe, Schatten, Glühen oder einen anderen Filtereffekt benötigt:

Laden Sie die SVG-Datei mit SVGDocument.
Finden oder erstellen Sie das Element <defs>, das wiederverwendbare Definitionen speichert.
Finden oder erstellen Sie ein <filter>-Element mit stabiler id.
Fügen Sie Filterprimitive wie <feGaussianBlur>, <feOffset> oder <feDropShadow> hinzu oder aktualisieren Sie sie.
Wenden Sie den Filter mit filter="url(#filter-id)" auf ein sichtbares SVG-Element an.
Speichern Sie das bearbeitete SVG und prüfen Sie die gerenderte Ausgabe.

Die Beispiele unten verwenden svg-filters.svg als Eingabedatei.

Filter für Unschärfe erstellen und anwenden

Ein Filter muss definiert sein, bevor ein sichtbares Element ihn verwenden kann. Das folgende Beispiel erstellt einen Filter #blur in <defs>, fügt ein Primitiv <feGaussianBlur> hinzu, wendet den Filter auf den Kreis an und speichert das Ergebnis als svg-blur-filter-applied.svg.

 1import os
 2from aspose.svg import SVGDocument
 3
 4SVG_NS = "http://www.w3.org/2000/svg"
 5
 6input_folder = "data/"
 7output_folder = "output/"
 8input_path = os.path.join(input_folder, "svg-filters.svg")
 9output_path = os.path.join(output_folder, "svg-blur-filter-applied.svg")
10os.makedirs(output_folder, exist_ok=True)
11
12with SVGDocument(input_path) as document:
13    svg = document.root_element
14    defs = svg.query_selector("defs")
15
16    if defs is None:
17        defs = document.create_element_ns(SVG_NS, "defs")
18        svg.insert_before(defs, svg.first_child)
19
20    blur_filter = document.create_element_ns(SVG_NS, "filter")
21    blur_filter.set_attribute("id", "blur")
22    blur_filter.set_attribute("x", "-20%")
23    blur_filter.set_attribute("y", "-20%")
24    blur_filter.set_attribute("width", "140%")
25    blur_filter.set_attribute("height", "140%")
26
27    gaussian_blur = document.create_element_ns(SVG_NS, "feGaussianBlur")
28    gaussian_blur.set_attribute("in", "SourceGraphic")
29    gaussian_blur.set_attribute("stdDeviation", "3")
30
31    blur_filter.append_child(gaussian_blur)
32    defs.append_child(blur_filter)
33
34    circle = svg.query_selector("circle")
35    if circle is not None:
36        circle.set_attribute("filter", "url(#blur)")
37
38    document.save(output_path)

Der Code zeigt beide erforderlichen Teile eines SVG-Filterablaufs. Die Elemente <filter> und <feGaussianBlur> definieren den Effekt, und das Attribut filter="url(#blur)" wendet diesen Effekt auf den sichtbaren Kreis an. Die Abbildung vergleicht das Ausgangs-SVG in Bild (a) mit dem unscharfen Kreis in Bild (b).

Ursprünglicher SVG-Kreis mit Text im Vergleich zu einem Kreis mit Gaussian-Blur-Filter in Python

Schlagschattenfilter erstellen

Erstellen Sie einen neuen Filter, wenn das SVG den benötigten Effekt noch nicht enthält. Das nächste Beispiel erstellt einen Filter #label-shadow mit <feDropShadow>, hängt ihn an <defs> an und wendet ihn auf die Textbeschriftung an.

 1import os
 2from aspose.svg import SVGDocument
 3
 4SVG_NS = "http://www.w3.org/2000/svg"
 5
 6input_folder = "data/"
 7output_folder = "output/"
 8input_path = os.path.join(input_folder, "svg-filters.svg")
 9output_path = os.path.join(output_folder, "svg-drop-shadow-filter.svg")
10os.makedirs(output_folder, exist_ok=True)
11
12with SVGDocument(input_path) as document:
13    svg = document.root_element
14    defs = svg.query_selector("defs")
15
16    if defs is None:
17        defs = document.create_element_ns(SVG_NS, "defs")
18        svg.insert_before(defs, svg.first_child)
19
20    shadow_filter = document.create_element_ns(SVG_NS, "filter")
21    shadow_filter.set_attribute("id", "label-shadow")
22    shadow_filter.set_attribute("x", "-20%")
23    shadow_filter.set_attribute("y", "-20%")
24    shadow_filter.set_attribute("width", "150%")
25    shadow_filter.set_attribute("height", "150%")
26
27    drop_shadow = document.create_element_ns(SVG_NS, "feDropShadow")
28    drop_shadow.set_attribute("dx", "6")
29    drop_shadow.set_attribute("dy", "8")
30    drop_shadow.set_attribute("stdDeviation", "2")
31    drop_shadow.set_attribute("flood-color", "#455a64")
32    drop_shadow.set_attribute("flood-opacity", "0.6")
33
34    shadow_filter.append_child(drop_shadow)
35    defs.append_child(shadow_filter)
36
37    label = svg.query_selector("#label")
38    if label is not None:
39        label.set_attribute("filter", "url(#label-shadow)")
40
41    document.save(output_path)

Dieses Beispiel zeigt beide Teile des Filterablaufs: Der wiederverwendbare Filter wird in <defs> erstellt, und das sichtbare Textelement erhält filter="url(#label-shadow)". Wenn einer der beiden Teile fehlt, erscheint der Schatten nicht. Die Abbildung zeigt die ursprüngliche Beschriftung in Bild (a) und dieselbe Beschriftung mit Schlagschatten in Bild (b).

Ursprünglicher SVG-Text im Vergleich zu SVG-Text nach dem Hinzufügen eines Schlagschattenfilters in Python

Attribute eines vorhandenen Filters bearbeiten

Filtereffekte werden durch Attribute an Filterprimitiven gesteuert. Das folgende Beispiel öffnet das SVG aus dem Unschärfe-Beispiel, findet <feGaussianBlur> innerhalb von #blur und erhöht den Wert stdDeviation.

 1import os
 2from aspose.svg import SVGDocument
 3
 4input_folder = "output/"
 5output_folder = "output/"
 6input_path = os.path.join(input_folder, "svg-blur-filter-applied.svg")
 7output_path = os.path.join(output_folder, "svg-filter-attributes-edited.svg")
 8os.makedirs(output_folder, exist_ok=True)
 9
10with SVGDocument(input_path) as document:
11    svg = document.root_element
12    blur = svg.query_selector("#blur feGaussianBlur")
13
14    if blur is not None:
15        blur.set_attribute("stdDeviation", "8")
16
17    document.save(output_path)

Die Ausgabe verwendet dieselbe Filter-ID, aber die Unschärfe ist stärker, weil sich stdDeviation von 3 auf 8 geändert hat. Die Abbildung vergleicht das erste Unschärfeergebnis in Bild (a) mit der stärkeren Unschärfe nach dem Bearbeiten des Filterprimitivs in Bild (b).

SVG-Gaussian-Blur-Ergebnis im Vergleich zu stärkerer Unschärfe nach dem Bearbeiten von stdDeviation in Python

Filter von einem SVG-Element entfernen

Einen Filter von einem sichtbaren Element zu entfernen ist etwas anderes als die Filterdefinition zu löschen. Das nächste Beispiel öffnet das SVG aus dem Unschärfe-Beispiel und entfernt nur die Referenz filter vom Kreis; die Definition #blur kann zur Wiederverwendung in <defs> bleiben.

 1import os
 2from aspose.svg import SVGDocument
 3
 4input_folder = "output/"
 5output_folder = "output/"
 6input_path = os.path.join(input_folder, "svg-blur-filter-applied.svg")
 7output_path = os.path.join(output_folder, "svg-filter-removed.svg")
 8os.makedirs(output_folder, exist_ok=True)
 9
10with SVGDocument(input_path) as document:
11    circle = document.root_element.query_selector("circle")
12
13    if circle is not None and circle.has_attribute("filter"):
14        circle.remove_attribute("filter")
15
16    document.save(output_path)

Verwenden Sie dieses Muster, wenn ein Filter ein bestimmtes Element nicht mehr beeinflussen soll, andere Elemente aber dieselbe Filterdefinition weiter verwenden könnten.

Häufige Fehler und Lösungen

Problem	Lösung
Filter erscheint nicht	Stellen Sie sicher, dass das sichtbare Element `filter="url(#filter-id)"` hat und dass diese ID in `<defs>` existiert
Schatten oder Unschärfe wird abgeschnitten	Vergrößern Sie die Filterregion mit `x`, `y`, `width` und `height` am `<filter>`
Filter wirkt auf das falsche Element	Wenden Sie das Attribut `filter` auf die sichtbare Form oder Gruppe an, die den Effekt erhalten soll
Änderung von `fill` oder `stroke` ändert den Effekt nicht	Aktualisieren Sie Attribute des Filterprimitivs, etwa `stdDeviation`, `flood-color`, `dx` oder `dy`
Doppelte Filter-IDs führen zu verwirrender Ausgabe	Verwenden Sie stabile eindeutige IDs und aktualisieren Sie `url(#...)`-Referenzen entsprechend
Ausgabedatei ist unverändert	Speichern Sie das bearbeitete Dokument und öffnen Sie den Ausgabepfad, nicht das Eingabe-SVG

FAQ

Wie wende ich einen SVG-Filter in Python an?

Laden Sie das SVG mit SVGDocument, finden Sie das sichtbare Zielelement und setzen Sie filter="url(#filter-id)" mit set_attribute(). Das referenzierte <filter> muss im SVG-Dokument existieren, normalerweise innerhalb von <defs>.

Wie erstelle ich einen SVG-Filter für Unschärfe?

Erstellen Sie ein <filter>-Element in <defs>, fügen Sie das Primitiv <feGaussianBlur> hinzu, setzen Sie stdDeviation und wenden Sie den Filter dann mit filter="url(#filter-id)" auf ein sichtbares Element an.

Wie füge ich SVG in Python einen Schlagschatten hinzu?

Erstellen Sie einen Filter mit einem Schattenprimitiv wie <feDropShadow>, setzen Sie Attribute wie dx, dy, stdDeviation und flood-color, hängen Sie den Filter an <defs> an und wenden Sie ihn mit filter="url(#filter-id)" an.

Kann ich vorhandene SVG-Filterattribute bearbeiten?

Ja. Finden Sie das Filterprimitiv, zum Beispiel #blur feGaussianBlur, und aktualisieren Sie Attribute wie stdDeviation. Speichern Sie das SVG nach der Änderung.

Kann ich einen Filter entfernen, ohne ihn aus defs zu löschen?

Ja. Entfernen Sie das Attribut filter vom sichtbaren Element. Die Definition <filter> kann in <defs> bleiben, wenn andere Elemente sie noch verwenden oder wenn Sie sie später wiederverwenden möchten.