SVG/Element/polyline

Das polyline-Element beschreibt einen Polygonzug (oder Polylinie), der aus verschiedenen Koordinatenpunkten besteht.

• Punkte dürfen aus positiven und negativen Zahlen bestehen.
• Trennzeichen einer Dezimalzahl ist grundsätzlich der Punkt.
• Die einzelnen Koordinaten werden durch ein Komma oder ein Whitespace-Zeichen voneinander getrennt.

Syntax

Start-Tag: notwendig

End-Tag: ggf. notwendig

Elternelemente

Darf vorkommen in:
jedem Element, das fließenden Inhalt erlaubt.

erlaubte Inhalte

animate, animateMotion, animateTransform, set, title (dann wird ein End-Tag nötig)

Attribute

Name	Inhalt	Standardwert	Bedeutung
points	NUMBER	Pixelwert	enthält alle Punkte der Polylinie / des Polygons
systemLanguage	CDATA
transform	CDATA

Attribut: Pflichtattribut
Attribut: optionales Attribut

Beispiel ansehen …

<polyline class="eins" points="10,10 40,40 10,70 40,100 10,130 40,160 10,190" />
<polyline class="zwei" points="110,10 140,40 110,70 140,100 110,130 140,160 110,190"/>
<polyline points="210,10 240,40 210,70 240,100 210,130 240,160 210,190" class="drei"/>
<polyline points="310,80, 340,10, 370,80, 440,110, 370,140, 340,210, 310,140, 240,140"	class="drei" />

Empfehlung: Mit den polyline- und polygon-Elementen legen Sie Fixpunkte fest. Wenn Sie die Form anschließend verschieben wollen, müssen Sie entweder alle Punkte ändern oder eine Transformation ausführen.

Deshalb verwende ich lieber das path-Element. Hier können Sie Punkte relativ festlegen. Falls Sie die Form anschließend verschieben wollen, müssen Sie nur die Anfangskoordinaten im MoveTo-Kommando ändern.

--Matthias Scharwies (Diskussion) 07:55, 11. Jan. 2020 (CET)

Siehe auch

• SVG/Farben/Markierungen#context-fill_und_context-stroke

Weblinks

• W3C: PolylineElement