SVG/Elemente/polygon

Das polygon-Element definiert ein Polygon (Vieleck). Es besitzt wie die Polylinie eine Punktemenge, die ein Objekt beschreibt. Bei einem Polygonzug wird jedoch der Startpunkt nicht mit dem Endpunkt dieser Menge verknüpft, während dies bei einem Polygon der Fall ist.

Beispiel

<polygon id="eins" points="100,10 150,190 50,190"/>
<polygon id="zwei" points="300,10 350,190 300,170 250,190" />

SVG erlaubt mehrere korrekte Schreibweisen für die Angabe der Punktemenge:

• 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.

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/Tutorials/Grundformen#Polygon

Weblinks

• W3C: PolygonElement

Syntax	Start-Tag: notwendig End-Tag: ggf. notwendig <polygon /> <polygon>   <!-- Kindelement(e) --> </polygon>
Elternelemente	Darf vorkommen in: jedem Element, das fließenden Inhalt erlaubt.
erlaubte Inhalte	animate, animateMotion, animateTransform, set
Browsersupport	Details: {{{caniuse}}}

Attribute

Name	Inhalt	Standardwert	Bedeutung
Kernattribute
class	ID		ordnet ein Element einer oder mehreren Klassen zu.
id	ID		identifiziert ein einziges Element innerhalb eines Dokuments
lang	ID		identifiziert eine Sprachangabe
style	ID	CDATA	Stilangabe durch Präsentationsattribute
tabindex	ID		macht Element „antabbbar“
xml:base	CDATA		Basis-URL
xml:lang		Sprachkürzel	legt eine den IANA-Sprachdefinitionen folgende Sprache des Elementinhalts fest [RFC1766]
xml:space		default, preserve	Verhalten gegenüber whitespace)
Präsentationsattribute
alignment-baseline
baseline-shift
clip
clip-path
clip-rule
color
cursor
cx			(SVG2)
cy			(SVG2)
direction
display
dominant-baseline
filter
flood-color
flood-opacity
font
font-family
font-size
font-size-adjust
font-stretch
font-style
font-variant
font-weight
glyph-orientation-horizontal
glyph-orientation-vertical
height			(SVG2)
isolation
letter-spacing
lighting-color
mask
opacity
overflow
pointer-events
r			(SVG2)
rx			(SVG2)
ry			(SVG2)
text-anchor
text-decoration
unicode-bidi
visibility
word-spacing
writing-mode
width			(SVG2)
x			(SVG2)
y			(SVG2)
points	CDA TA	Pixelwert	enthält alle Punkte der Polylinie / des Polygons
systemLanguage	IANA		Sprachkürzel
transform	CDATA

Attribut: Pflichtattribut
Attribut: optionales Attribut