<canvas> gradient-Verläufe nur mit fillRect() möglich?

[Matthias]

Ich probiere im Augenblick etwas mit <canvas> herum:

http://www.jsr-hersbruck.de/site/beispiel/canvas-haus.php

Ich möchte das Fenster (function drawFenster(); in Zeile 148) mit einem Verlauf beleuchten - es wird mit ctx.fill() aber nur gelb gefüllt.

function drawFenster(ctx, xoff, yoff) {  
	var breite= 20;  
	var hoehe = 20;  
	var neigung = 4;  
	var lingrad = ctx.createLinearGradient(0,0,0,25);  
    lingrad.addColorStop(0, 'orange');  
    lingrad.addColorStop(1, 'yellow');  
  
    // assign gradients to fill and stroke styles  
    ctx.fillStyle = lingrad;  
	ctx.strokeStyle='black';  
  ctx.beginPath();  
  ctx.moveTo(xoff, yoff);  
  ctx.lineTo(breite + xoff, -neigung+ yoff);  
  ctx.lineTo(breite + xoff, (hoehe - neigung) + yoff);  
  ctx.lineTo(xoff, hoehe+ yoff);  
  ctx.lineTo(xoff, yoff);  
  	ctx.closePath();  
  ctx.stroke();  
  ctx.fill();  
}

Alle Beispiele zeigen
createLinearGradient + createRadialGradient

nur mit fillRect(a,b,c,d,).

function drawMoon() in Zeile 202 funktionert aber mit ctx.fill()

Kann mir jemand einen Tipp geben, woran es bei drawFenster() hakt?

Vielen Dank im Voraus!
Matthias