Information Technology Reference
In-Depth Information
Abbildung 5.14:
Die Pfadmethode »rect()«
5.5.5
Umrisse, Füllungen und Clipmasken
Wenn wir uns an die drei Phasen der Pfaderstellung mit Initialisierung, Fest-
legen der Pfadgeometrie und Zeichnen erinnern, dann sind wir jetzt bei der
dritten und letzten Phase angekommen: dem Zeichnen. Hier fällt die Entschei-
dung, wie der fertige Pfad aussehen soll. Alle bisherigen Beispiele entschieden
sich an dieser Stelle für eine einfache Umrisslinie, die durch folgende Methode
erzeugt wird:
context.stroke()
Die Farbe der Linie bestimmt dabei das Attribut
strokeStyle
. Daneben lassen
sich die Linienstärke (
lineWidth
), das Aussehen der Linienenden (
lineCap
) so-
wie das Erscheinungsbild der Verbindung zwischen Linien (
lineJoin
) über drei
weitere Canvas-Attribute festlegen (der Stern kennzeichnet Defaultwerte und
wird uns ab jetzt noch öfter begegnen).
context.lineWidth = [ Pixel ]
context.lineCap = [ *butt, round, square ]
context.lineJoin = [ bevel, round, *miter ]