Hallo Miteinander.
Ich setze mich in meinem aktuellen Projekt mit HTML5 und dem Canvas Element auseinander. Ich glaube ich habe ein Verständnisproblem mit der Save/Restore Funktionalität. Mein Ziel ist folgendes:
Ich zeichne eine komplexe Grafik in mein Canvas und speichere diese Grafik mit Save(). Danach zeichne ich einen simplen Overlay auf diese Grafik um einige Elemente zu markieren. In einem gewissen Intervall werden diese Overlays aktualisiert. Dazu stelle ich den alten Zustand mit Restore() wiederher, speichere in erneut auf den Stack Save() und zeichne den Overlay neu. Seltsamerweise wird aber der mit Save() gespeicherte Zustand nicht wiederhergestellt. Das Coding ist jenes:

Code javascript:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30

net.coderline.jsgs.tablature.Tablature.prototype.OnPaint = function() {     if(this.Track == null) { // invalid data         // paint info message         this.PaintBackground();         var text = this.ErrorMessage;         this.Canvas.setFillStyle("#4e4e4e");         this.Canvas.setFont("20px Arial");         this.Canvas.setTextBaseline("middle");         this.Canvas.fillText(text,20,30);         return;     }     else if(this.UpdateDisplay) { // complex update         // paint complex graphics         this.PaintBackground();         var displayRect = new net.coderline.jsgs.model.Rectangle(0,0,this.Width,this.Height);         this.ViewLayout.PaintCache(this.Canvas,displayRect,0,0);         // save state of complex graphics         this.Canvas.save();         this.UpdateDisplay = false;     }     else { // overlay update         // restore complex graphics         this.Canvas.restore();         // and save it for next restore         this.Canvas.save();     }         // paint overlay     this.PaintCaret(); }

Hab ich diese save/restore Mechanismen falsch verstanden, oder habe ich einfach nur etwas vergessen?

Ich hab die Mechanismen wirklich falsch verstanden. Ich hab mir nochmals einige Dokus im Detail durchgelesen und habe herausgefunden dass lediglich Zeicheninformationen wie fillStyle, strokeStyle, lineWidth und lineJoin mit diesem save/store Mechanismus gespeichert werden. Für meinen Fall als Bild-Buffer werde ich die beiden Funktionen getImageData und putImageData verwenden müssen.

Grüße Daniel