Analyzing your prompt, please hold on...
An error occurred while retrieving the results. Please refresh the page and try again.
Kurze Antwort: Um SVG-Formen in Python zu zeichnen, erstellen Sie ein
SVGDocument, setzen Sie Größe und viewBox des SVG-Wurzelelements, erstellen Sie Formelemente mit
create_element_ns(), setzen Sie Geometrie- und Stilattribute mit
set_attribute(), hängen Sie jede Form an das Wurzelelement an und speichern Sie das SVG.
1from aspose.svg import SVGDocument
2
3with SVGDocument() as document:
4 svg = document.root_element
5 rect = document.create_element_ns("http://www.w3.org/2000/svg", "rect")
6 rect.set_attribute("width", "80")
7 rect.set_attribute("height", "50")
8 svg.append_child(rect)
9 document.save("shapes.svg")In diesem Artikel lernen Sie, wie Sie:
rect, circle, ellipse, line, polyline und polygon setzen;fill- und stroke-Attribute auf generierte Formen anwenden;SVG-Formen sind die einfachsten Bausteine für generierte Diagramme, Icons, Charts, Badges und Illustrationen. Jede Form besitzt eigene Geometrieattribute: ein Rechteck verwendet x, y, width und height; ein Kreis verwendet cx, cy und r; ein Polygon verwendet eine points-Liste. Mehr Hintergrund zu SVG-Markup finden Sie im Leitfaden
SVG Shapes.
| Element | Wichtige Geometrieattribute | Verwenden für |
|---|---|---|
<rect> | x, y, width, height, rx | Boxen, Panels, Karten und abgerundete Rechtecke |
<circle> | cx, cy, r | Punkte, Badges, Marker und runde Icons |
<ellipse> | cx, cy, rx, ry | Ovale oder nicht kreisförmige Marker |
<line> | x1, y1, x2, y2 | Ein einzelnes gerades Segment |
<polyline> | points | Verbundene offene Segmente |
<polygon> | points | Geschlossene Formen wie Dreiecke und Sterne |
Verwenden Sie diesen Workflow, wenn Sie eine SVG-Zeichnung aus Formprimitiven erzeugen möchten:
SVGDocument.width, height und viewBox.document.create_element_ns(namespace_uri, qualified_name).set_attribute().append_child() an das SVG-Wurzelelement an.document.save(output_path).Verwenden Sie Rechtecke, Kreise und Ellipsen, wenn sich die Grafik durch einfache Werte für Mittelpunkt, Größe und Radius beschreiben lässt. Das folgende Beispiel erzeugt eine kleine Szene mit einem Rechteck als vollflächigem Hintergrund, einem Kreis als Hauptobjekt und einer Ellipse als weichem Schatten.
1import os
2from aspose.svg import SVGDocument
3
4namespace_uri = "http://www.w3.org/2000/svg"
5
6output_folder = "output/"
7output_path = os.path.join(output_folder, "svg-basic-shapes.svg")
8os.makedirs(output_folder, exist_ok=True)
9
10with SVGDocument() as document:
11 svg = document.root_element
12 svg.set_attribute("width", "300")
13 svg.set_attribute("height", "200")
14 svg.set_attribute("viewBox", "0 0 300 200")
15
16 rectangle = document.create_element_ns(namespace_uri, "rect")
17 rectangle.set_attribute("width", "300")
18 rectangle.set_attribute("height", "200")
19 rectangle.set_attribute("fill", "#e6eafa")
20 svg.append_child(rectangle)
21
22 circle = document.create_element_ns(namespace_uri, "circle")
23 circle.set_attribute("cx", "150")
24 circle.set_attribute("cy", "75")
25 circle.set_attribute("r", "50")
26 circle.set_attribute("fill", "#2e86de")
27 circle.set_attribute("stroke", "#0d47a1")
28 circle.set_attribute("stroke-width", "8")
29 svg.append_child(circle)
30
31 ellipse = document.create_element_ns(namespace_uri, "ellipse")
32 ellipse.set_attribute("cx", "150")
33 ellipse.set_attribute("cy", "155")
34 ellipse.set_attribute("rx", "70")
35 ellipse.set_attribute("ry", "20")
36 ellipse.set_attribute("fill", "#90a4ae")
37 ellipse.set_attribute("opacity", "0.35")
38 svg.append_child(ellipse)
39
40 document.save(output_path)Das gespeicherte SVG enthält nur generierte DOM-Elemente. Dieser Ansatz ist nützlich, wenn eine Anwendung Formpositionen berechnet und anschließend die fertige SVG-Datei schreibt.
Die Abbildung zeigt, wie die drei Formelemente zusammenwirken: Das Rechteck füllt die gesamte viewBox als heller Hintergrund, der Kreis erzeugt das blaue Objekt und die halbtransparente Ellipse darunter wirkt wie ein Schatten.

Verwenden Sie line für ein einzelnes Segment, polyline für eine offene verbundene Linie und polygon für eine geschlossene Form. Das Attribut points enthält eine durch Leerzeichen getrennte Liste von Koordinatenpaaren.
1import os
2from aspose.svg import SVGDocument
3
4namespace_uri = "http://www.w3.org/2000/svg"
5
6output_folder = "output/"
7output_path = os.path.join(output_folder, "svg-lines-polygons.svg")
8os.makedirs(output_folder, exist_ok=True)
9
10with SVGDocument() as document:
11 svg = document.root_element
12 svg.set_attribute("width", "520")
13 svg.set_attribute("height", "300")
14 svg.set_attribute("viewBox", "0 0 520 300")
15
16 line = document.create_element_ns(namespace_uri, "line")
17 line.set_attribute("x1", "30")
18 line.set_attribute("y1", "20")
19 line.set_attribute("x2", "130")
20 line.set_attribute("y2", "290")
21 line.set_attribute("stroke", "#4387be")
22 line.set_attribute("stroke-width", "10")
23 svg.append_child(line)
24
25 polyline = document.create_element_ns(namespace_uri, "polyline")
26 polyline.set_attribute("points", "100,100 160,50 220,100 280,50 340,100 400,50")
27 polyline.set_attribute("fill", "none")
28 polyline.set_attribute("stroke", "#fb6796")
29 polyline.set_attribute("stroke-width", "5")
30 svg.append_child(polyline)
31
32 polygon = document.create_element_ns(namespace_uri, "polygon")
33 polygon.set_attribute("points", "360,290 430,20 500,290")
34 polygon.set_attribute("fill", "#86a9b9")
35 polygon.set_attribute("stroke", "#fb6796")
36 polygon.set_attribute("stroke-width", "5")
37 svg.append_child(polygon)
38
39 document.save(output_path)Linie und Polylinie verwenden stroke, weil sie Konturen zeichnen. Das Polygon verwendet sowohl fill als auch stroke, weil es eine geschlossene Fläche bildet.
Die Abbildung zeigt den Unterschied zwischen den drei Elementen. <line> zeichnet ein einzelnes gerades Segment, <polyline> zeichnet einen offenen Zickzack aus der points-Liste und <polygon> schließt seine Punkte automatisch zu einem gefüllten Dreieck.

| Problem | Lösung |
|---|---|
| Die Form erscheint nicht | Prüfen Sie, ob das Element mit append_child() an das SVG-Wurzelelement angehängt wurde |
| Die Form liegt außerhalb des sichtbaren Bereichs | Prüfen Sie viewBox, Koordinaten, width und height |
| Die Linie ist unsichtbar | Setzen Sie stroke und stroke-width; fill macht eine Linie nicht sichtbar |
| Das Polygon wirkt offen oder falsch | Prüfen Sie die Koordinatenpaare in points und ihre Reihenfolge |
| Das abgerundete Rechteck ist nicht rund | Setzen Sie rx oder ry am <rect>-Element |
Die Antworten unten verwenden dasselbe DOM-Muster wie die Beispiele: SVG-Element mit document.create_element_ns(namespace_uri, element_name) erstellen, Geometrie- und Stilattribute setzen, an das SVG-Wurzelelement anhängen und das Dokument speichern.
Sie können SVG-Grundformen wie rect, circle, ellipse, line, polyline und polygon erstellen. Nutzen Sie diese Elemente für Boxen, Badges, Marker, einfache Diagramme, verbundene Linien, Dreiecke und andere Formen mit geraden Kanten.
Verwenden Sie ein rect-Element und setzen Sie x, y, width und height. Ergänzen Sie Stilattribute wie fill, stroke oder rx, hängen Sie das Rechteck an das SVG-Wurzelelement an und speichern Sie das Dokument.
Verwenden Sie ein circle-Element mit cx, cy und r. Fügen Sie fill- oder stroke-Attribute hinzu, hängen Sie den Kreis an das SVG-Wurzelelement an und speichern Sie das SVG.
Verwenden Sie ein ellipse-Element mit cx und cy für den Mittelpunkt und setzen Sie anschließend rx und ry für den horizontalen und vertikalen Radius. Ergänzen Sie fill, stroke oder opacity, bevor Sie das Element anhängen.
Verwenden Sie ein line-Element und setzen Sie x1, y1, x2 und y2. Eine Linie benötigt stroke und meist stroke-width; nur fill macht sie nicht sichtbar.
Verwenden Sie ein polyline-Element und setzen Sie points auf Koordinatenpaare wie "30,120 70,75 115,110". Setzen Sie fill="none", wenn nur die verbundene Kontur sichtbar sein soll.
Verwenden Sie ein polygon-Element mit drei Koordinatenpaaren im Attribut points, zum Beispiel "50,10 90,80 10,80". Ergänzen Sie fill und stroke, hängen Sie das Polygon an das SVG-Wurzelelement an und speichern Sie das SVG.
Verwenden Sie ein rect-Element und setzen Sie zusätzlich zu x, y, width und height auch rx oder ry. Die Werte rx und ry steuern den Eckenradius.
Eine Form ist meist unsichtbar, wenn sie nicht an das SVG-Wurzelelement angehängt wurde, außerhalb der viewBox liegt oder die nötigen Paint-Attribute fehlen. Für Linien und Polylinien setzen Sie stroke und stroke-width; für geschlossene Formen setzen Sie fill, stroke oder beides.
Verwenden Sie polygon für geschlossene Formen aus geraden Liniensegmenten. Verwenden Sie <path>, wenn die Form Kurven, gemischte Befehle, mehrere Teilpfade oder komplexere Geometrie benötigt.
Analyzing your prompt, please hold on...
An error occurred while retrieving the results. Please refresh the page and try again.