Grundformen

Pfade

Pfade Elementpath sind komplexer als die vorangegangen Grundformen aber ähnlich aufgebaut wie diepolyline. Zuerst erläutere ich die Steuerzeichen großgeschrieben Steuerzeichen sind immer absolute definiert klein geschriebene relativ vom vorherigen Punkt. Man muss wie bei der polyline immer den nächsten Punkt angeben.

• M ist der Startpunkt des Pfades.
• L lineto zeichnet eine gerade Linie zum nächsten Punkt.
• z schließt den Pfad der Startpunkt wird mit dem zuletzt angegeben Punkt verbunden.
• H, h steht für horizontal und zeichnet eine horizontale Linie zum nächsten Punkt.
• V, v dasselbe nur vertikal.
• Q, q steht für quadratic bézier curveto die Linie zum nächsten Punkt wird nicht gerade sondern eine Kurve.

Ein Beispiel:





Das schwarze Rechteck ist abgerundetrx & ry = 1 es folgt der Beispielcode:

 <path d="M 2 6 L 10 10 L 2 10 z "
    fill="yellow" stroke="red" 
    stroke-width="4"/>