<polygon>

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020.

Das <polygon> SVG Element definiert eine geschlossene Form, die aus einer Reihe verbundener gerader Liniensegmente besteht. Der letzte Punkt wird mit dem ersten Punkt verbunden.

Für offene Formen siehe das <polyline> Element.

Beispiel

html
<svg viewBox="0 0 200 100" xmlns="http://www.w3.org/2000/svg">
  <!-- Example of a polygon with the default fill -->
  <polygon points="0,100 50,25 50,75 100,0" />

  <!-- Example of the same polygon shape with stroke and no fill -->
  <polygon points="100,100 150,25 150,75 200,0" fill="none" stroke="black" />
</svg>

Attribute

points

Dieses Attribut definiert die Liste der Punkte (Paare von x,y absoluten Koordinaten), die benötigt werden, um das Polygon zu zeichnen. Wertetyp: <number>+ ; Standardwert: ""; Animierbar: ja

pathLength

Dieses Attribut ermöglicht es, die Gesamtlänge des Pfads in Benutzereinheiten anzugeben. Wertetyp: <number> ; Standardwert: none; Animierbar: ja

Verwendungszusammenhang

KategorienGrundformelement, Grafikelement, Formelement
Erlaubter InhaltBeliebige Anzahl folgender Elemente, in beliebiger Reihenfolge:
Animationselemente
Beschreibende Elemente

Spezifikationen

Specification
Scalable Vector Graphics (SVG) 2
# PolygonElement

Browser-Kompatibilität

BCD tables only load in the browser

Siehe auch