SVG-Text in Python zeichnen

Kurze Antwort: Um SVG-Text in Python zu zeichnen, erstellen Sie ein <text>-Element mit create_element_ns(), setzen die Attribute x, y, font-family, font-size, fill und text-anchor mit set_attribute(), setzen text_content, hängen den Text an das SVG-Wurzelelement an und speichern das Dokument.

from aspose.svg import SVGDocument

with SVGDocument() as document:
    text = document.create_element_ns("http://www.w3.org/2000/svg", "text")
    text.set_attribute("x", "20")
    text.set_attribute("y", "40")
    text.text_content = "Hello SVG"
    document.root_element.append_child(text)
    document.save("text.svg")

In diesem Artikel lernen Sie, wie Sie:

• SVG-<text>-Elemente in Python erstellen;
• Text mit x- und y-Koordinaten positionieren;
• die Attribute font-family, font-size, fill und text-anchor setzen;
• einfachen mehrzeiligen Text mit <tspan>-Elementen erstellen.

SVG-Text bleibt echter Text im SVG-Markup. Er kann später ausgewählt, durchsucht, lokalisiert, gestaltet und bearbeitet werden. Wenn Sie Text für finale Grafik oder fontunabhängiges Rendering in Vektorkonturen umwandeln müssen, verwenden Sie stattdessen Textvektorisierung. Mehr Hintergrund zu SVG-Markup finden Sie im Leitfaden SVG Text.

Grundlagen von SVG-Text

Attribut oder Element	Verwendung
x, y	Positioniert die Textgrundlinie
font-family	Wählt die angeforderte Schriftfamilie
font-size	Setzt die Textgröße in SVG-Einheiten
fill	Setzt die Textfarbe
text-anchor	Richtet Text relativ zur x-Koordinate aus
<tspan>	Fügt positionierte Fragmente oder einfachen mehrzeiligen Text hinzu

SVG-Text in Python zeichnen

Verwenden Sie diesen Workflow, wenn generierte SVG-Grafik Labels, Beschriftungen, Badges oder Text in Diagrammen benoetigt:

1. Erstellen oder laden Sie ein SVGDocument.
2. Setzen Sie width, height und viewBox des SVG-Wurzelelements, wenn Sie ein neues Dokument erstellen.
3. Erstellen Sie ein <text>-Element mit create_element_ns().
4. Setzen Sie Positions- und Stilattribute wie x, y, font-size, font-family, fill und text-anchor mit set_attribute().
5. Setzen Sie text_content oder hängen Sie <tspan>-Kindelemente an.
6. Hängen Sie das Textelement mit append_child() an das SVG-Wurzelelement an und speichern Sie das Dokument mit document.save().

Einfaches SVG-Textlabel erstellen

Das folgende Beispiel erstellt ein kleines SVG-Label mit Hintergrundrechteck und zentriertem Text. Verwenden Sie text-anchor="middle", wenn die x-Koordinate die horizontale Mitte des Textes darstellen soll.

import os
from aspose.svg import SVGDocument

namespace_uri = "http://www.w3.org/2000/svg"

output_folder = "output/"
output_path = os.path.join(output_folder, "svg-text-label.svg")
os.makedirs(output_folder, exist_ok=True)

with SVGDocument() as document:
    svg = document.root_element
    svg.set_attribute("width", "320")
    svg.set_attribute("height", "120")
    svg.set_attribute("viewBox", "0 0 320 120")

    background = document.create_element_ns(namespace_uri, "rect")
    background.set_attribute("x", "24")
    background.set_attribute("y", "24")
    background.set_attribute("width", "272")
    background.set_attribute("height", "72")
    background.set_attribute("rx", "12")
    background.set_attribute("fill", "#f7f7fb")
    background.set_attribute("stroke", "#546e7a")
    background.set_attribute("stroke-width", "3")
    svg.append_child(background)

    label = document.create_element_ns(namespace_uri, "text")
    label.set_attribute("x", "160")
    label.set_attribute("y", "68")
    label.set_attribute("text-anchor", "middle")
    label.set_attribute("font-family", "Arial, sans-serif")
    label.set_attribute("font-size", "26")
    label.set_attribute("font-weight", "700")
    label.set_attribute("fill", "#263238")
    label.text_content = "SVG Text"
    svg.append_child(label)

    document.save(output_path)

Die Textgrundlinie wird durch y gesteuert, nicht durch die obere Kante der Buchstaben. Wenn die vertikale Position exakt optisch zentriert sein muss, passen Sie den y-Wert an oder verwenden Sie Schriftmetriken in Ihrer eigenen Layoutlogik.

Die Abbildung zeigt das Ergebnis des Beispiels: Ein abgerundetes Rechteck dient als einfacher Label-Hintergrund, und text-anchor="middle" richtet die Beschriftung SVG Text an der mittleren x-Koordinate aus.

Mehrzeiligen SVG-Text mit <tspan> erstellen

Verwenden Sie <tspan>, wenn ein Textblock mehrere Zeilen oder separat positionierte Fragmente enthalten soll. Das nächste Beispiel erstellt ein <text>-Element und hängt zwei <tspan>-Kindelemente mit unterschiedlichen y-Positionen an.

import os
from aspose.svg import SVGDocument

namespace_uri = "http://www.w3.org/2000/svg"

output_folder = "output/"
output_path = os.path.join(output_folder, "svg-multiline-text.svg")
os.makedirs(output_folder, exist_ok=True)

with SVGDocument() as document:
    svg = document.root_element
    svg.set_attribute("width", "400")
    svg.set_attribute("height", "120")
    svg.set_attribute("viewBox", "0 0 400 120")

    text = document.create_element_ns(namespace_uri, "text")
    text.set_attribute("x", "200")
    text.set_attribute("y", "48")
    text.set_attribute("font-family", "Arial, sans-serif")
    text.set_attribute("font-size", "22")
    text.set_attribute("text-anchor", "middle")
    text.set_attribute("fill", "#263238")

    first_line = document.create_element_ns(namespace_uri, "tspan")
    first_line.set_attribute("x", "200")
    first_line.set_attribute("y", "48")
    first_line.text_content = "Generated SVG Text"
    text.append_child(first_line)

    second_line = document.create_element_ns(namespace_uri, "tspan")
    second_line.set_attribute("x", "200")
    second_line.set_attribute("y", "84")
    second_line.set_attribute("fill", "#2e86de")
    second_line.text_content = "with Aspose.SVG for Python via .NET"
    text.append_child(second_line)

    svg.append_child(text)
    document.save(output_path)

Beide Zeilen gehören zum selben <text>-Element, aber jedes <tspan> besitzt eine eigene Position und kann Stilattribute wie fill überschreiben.

Die Abbildung zeigt die zweizeilige SVG-Textausgabe. Das erste <tspan> zeichnet den dunklen Titel, und das zweite <tspan> verwendet eine eigene y-Position sowie einen blauen fill-Wert für die Unterzeile.

Häufige Fehler und Lösungen

Problem	Lösung
Text ist nicht sichtbar	Setzen Sie fill, prüfen Sie x und y, und stellen Sie sicher, dass der Text innerhalb der viewBox liegt
Text erscheint zu hoch oder zu niedrig	Denken Sie daran, dass y die Textgrundlinie positioniert, nicht die obere Kante
Zentrierung funktioniert nicht	Setzen Sie text-anchor="middle" und verwenden Sie die gewünschte Mitte als x-Wert
Mehrzeiliger Text überlappt	Geben Sie jedem <tspan> einen eigenen y-Wert oder verwenden Sie dy-Abstände kontrolliert
Text wird auf einem anderen Rechner anders gerendert	Verwenden Sie verbreitete Schriftarten oder wandeln Sie finale Grafik in Vektorpfade um, wenn Fontunabhängigkeit wichtig ist

FAQ

Wie füge ich Text zu SVG in Python hinzu?

Erstellen Sie ein <text>-Element mit create_element_ns(), setzen Sie die Attribute x, y, font-family, font-size und fill, setzen Sie text_content, hängen Sie es an das SVG-Wurzelelement an und speichern Sie das SVG.

Wie zentriere ich SVG-Text?

Setzen Sie text-anchor="middle" und setzen Sie x auf die gewünschte horizontale Mitte. Passen Sie y für die Position der Grundlinie an.

Kann ich mehrzeiligen SVG-Text erstellen?

Ja. Verwenden Sie ein <text>-Element mit mehreren <tspan>-Kindelementen. Geben Sie jedem <tspan> eigene Werte für x und y oder verwenden Sie kontrollierte dy-Abstände.

Sollte ich SVG-Text zeichnen oder Text vektorisieren?

Zeichnen Sie normalen SVG-Text, wenn der Text editierbar, durchsuchbar oder lokalisierbar bleiben soll. Vektorisieren Sie Text nur für finale Grafik, die exakte Glyphenkonturen ohne Abhängigkeit von installierten Schriftarten bewahren muss.

Verwandte Artikel

• SVG viewBox und Koordinaten in Python erklärt, wie Textkoordinaten dem sichtbaren SVG-Bereich zugeordnet werden.
• SVG-Formen in Python zeichnen zeigt, wie Sie Text mit generierten Formen kombinieren.
• SVG-Icons in Python erstellen verwendet textnahe Zeichenmuster für kompakte generierte Grafik.
• Text in Python in Vektoren konvertieren erklärt, wie Sie SVG-Text für finale fontunabhängige Ausgabe in Vektorkonturen umwandeln.