HTML5 als Designwerkzeug - Apps mit HTML5 und CSS3: Fur iPad, iPhone und Android - page 190

Abbildung 4.45 Das Quadrat wird auf der Canvas gezeichnet.
Um ein rotes Rechteck zu zeichnen, müssen Sie zuvor eine Füllfarbe festlegen (Abbil-
dung 4.46). Dies geschieht analog zu CSS entweder per RGB-Wert oder als Hexadezimal-
code:
canvas.fillStyle = "#f00";
canvas.fillRect(50,50,200,200);
Abbildung 4.46 Rot eingefärbtes Quadrat
Die Füllfarbe bezieht sich auf alle Objekte, die Sie auf die Canvas zeichnen. Beachten
Sie daher immer die Reihenfolge: Erst eine Eigenschaft zuweisen, anschließend
zeichnen. Im Folgenden Beispiel zeichnen Sie ein rotes und ein blaues Rechteck:
canvas.fillStyle = "#f00";
canvas.fillRect(50,50,150,150);
canvas.fillStyle = "#00f";
canvas.fillRect(100,100,150,150);