HTML5 canvas med kinetic.js, repeterande bild?

Jag har sökt högt och lågt och inte hittat någon lösning här. Jag har ett canvas-element med variabel storlek (användaren bestämmer storleken) och behöver ha ett rutnät som bakgrund. Problemet är att jag antingen får ha en bakgrundsbild som är massiv (upp till 10 000 pixlar åt båda håll) eller dra ut rutnätet om personen väljer att ha så stor yta.

Dras rutnätet ut så blir det ju fel dimensioner på rutorna, så det är inte riktigt ett alternativ.
En bild på 10 000 x 10 000 tar massiv plats och tar extremt lång tid att ladda med ett segt nät, så det är inte heller ett alternativ.

I vanlig canvas-hantering kan man repetera en bild (tile), men jag har inte hittat något sådant när man använder kinetic.js. Vet någon ett bättre alternativ till de två jag har nämnt?

Sidofråga, när jag ändå har experter här:
Jag har en array med antalet lager i canvasen, om någon lägger till ett element så får det ett eget lager. Till detta har jag en knapp man kan trycka på för att ångra senaste, denna funktion clearar senaste lagret (layers[layers.length-1].clear();) och tar sedan bort den arrayplatsen (remove = layers[layers.length-1].pop();), men på alla platser utom den första så dyker det upp en "spökbild" i övre vänstra hörnet. Denna bild har ingen plats i arrayerna och ersätter allt på canvasen. Man ser allt annat och kan interagera med det som vanligt, men när man försöker få fram bilden (visa källa) så är det bara "spökbilden" som syns.

Koden är ganska lång, så jag slänger upp den på pastebin istället för den vanliga kod-taggen!

Tillägg: Med Firebug såg jag att det verkar läggas till ett nytt canvas-element för varje lager, istället för bara stage. Jag vet inte varför och har inte hittat något i koden som påverkar diven bortom stage och ingenting i koden som ersätter stage på något sätt, så jag börjar undra om jag förstått lager fel.

Den lägger även till en canvas varje gång jag trycker "ta bort"!

Update 2: Spökbildsproblemet är löst, hade missat att ta bort lagret (stage.remove(remove); i tabort-funktionen.
Problemet med att bara senaste bilden syns i "visa bild" är dock kvar och jag behöver fortfarande tile-a bakgrunden.

Försökte med den approachen och slutade med en div som antingen är osynlig (size: 0) eller täcker hela bredden på sidan, men bara blir 2px hög (om jag lägger in en &nbsp som innehåll och/eller ställer in den till display: block).

Ser ut som om jag får ta den approachen!

window.onload = function() {
				var layer = new Kinetic.Layer();
			for(i = 0; i<stage.width; i+10){
				var rect = new Kinetic.Rect({
                x: i,
                y: 0,
                width: 1,
                height: stage.height,
                fill: "#CCC",
                stroke: "#CCC",
                strokeWidth: 2
				});
				layer.add(rect);
			}
			stage.add(layer);
		}

Vart är evighetsloopen? stage.width = 500, stage.height=1024
Startar sidan och den hänger sig en liten stund, sen kommer varning om skript som slutat funka (får den om jag får evighetsloop)...

Teorin: Den ritar ut "rektanglar" som är 1 pixel bred och har 2pixels border, så det blir en 5px bred linje från toppen till botten, följd av ytterligare en var 10'e pixel tills den når bredden av rutan.

Edit: Ok, fick den att funka, men lägger jag in den i min vanliga kod får jag felet "Config is undefined" och inget i kinetic.js vill funka... Tar jag bort den igen blir det samma fel... MAO: om jag tar med det scriptet kinect-3-8-2 som rect kräver, så pajjar koden från scriptet kinect-3-6-0 >.<

LÖST!

Pastebinnar den fungerande biten kod, utifall att nån annan vill ha!
http://pastebin.com/L48G1gh2