Information Technology Reference
In-Depth Information
Gültige Werte für das
repetition
-Argument sind, wie schon vom
background-
color
-Attribut der CSS-Spezifikation her bekannt,
repeat
,
repeat-x
,
repeat-y
,
und
no-repeat
. Verwenden wir wieder die 16 benannten Grundfarben, können
wir über ein paar Zeilen Code Schachbrettmuster mit jeweils zwei zusammen-
passenden Farbpaaren erzeugen.
Abbildung 5.33:
Schachbrettmuster in 8 Farbkombinationen
Das Pattern selbst erzeugen wir als
in-memory
-Canvas mit 20 x 20 Pixeln Breite
und vier 10x10 Pixel großen Quadraten. Am Beispiel des grünen Musters sieht
dieser Schritt folgendermaßen aus:
var cvs = document.createElement("CANVAS");
cvs.width = 20;
cvs.height = 20;
var ctx = cvs.getContext('2d');
ctx.fillStyle = 'lime';
ctx.fillRect(0,0,10,10);
ctx.fillRect(10,10,10,10);
ctx.fillStyle = 'green';
ctx.fillRect(10,0,10,10);
ctx.fillRect(0,10,10,10);
