SVG <line> zeichnet Geraden

Das SVG <line>-Element ist ein grundlegendes SVG-Element, das zur Erstellung einer Linie zwischen zwei Punkten verwendet wird. Das <line>-Element wird verwendet, um Linien innerhalb eines SVG-Bildes zu zeichnen. Es können horizontale Linien, vertikale Linien, schräge Linien und andere Linien gezeichnet werden.

SVG Line Online-Beispiel

Hier sind einige einfache Beispiele für die Verwendung von SVG <line> zur Zeichnung von Linien:

<svg　xmlns="http://www.w3.org/2000/svg"
　　　　xmlns:xlink="http://www.w3.org/1999/xlink">
　　　　　　　　<line　x1="0"　　y1="10"　x2="0"　　　y2="100"　style="stroke:#006600;"></line>
　　　　　　　　<line　x1="10"　y1="10"　x2="100"　y2="100"　style="stroke:#006600;"></line>
　　　　　　　　<line　x1="20"　y1="10"　x2="100"　y2="50"　　style="stroke:#006600;"></line>
　　　　　　　　<line　x1="30"　y1="10"　x2="110"　y2="10"　　style="stroke:#006600;"></line>
</svg>

Nachdem der obige Code ausgeführt wurde, erscheint die Geradenwirkung wie folgt:

Der Startpunkt der Geraden wird durch x1und y1An dem Punkt, an dem die Eigenschaft gesetzt wird.
Der Endpunkt der Geraden wird durch x2und y2An dem Punkt, an dem die Eigenschaft gesetzt wird.
Die style-Eigenschaft setzt die Farbe und Dicke des Strichs (der Linie) fest.