Javascript Leinwandzeichnung außer Betrieb?

Question

Ich versuche, etwas Text über ein Rechteck zu zeichnen, jedoch wird der Text aus irgendeinem Grund vor dem Rechteck gezeichnet. Dies gilt nicht zu geschehen scheint, wenn ich eine andere Form wie ein Bogen verwenden und geschieht in beiden Chromium und Firefox so glaube ich nicht, es ist ein Browser-Problem ist, das ist mein Code:

map_context.fillStyle = "#95609F"; 
map_context.rect(32,32,192,192); 
map_context.fill(); 

map_context.fillStyle = "white"; 
map_context.fillText("+", 128, 128); 

Answer 1

versuchen, diese zu ersetzen zwei Linien:

map_context.rect(32,32,192,192); 
map_context.fill(); 

mit nur:

map_context.fillRect(32,32,192,192); 

Sie wahrscheinlich diesen demselben Code in einer Schleife laufen mehrere Bilder zu zeichnen, aber vergessen, den Weg jedes Mal zu löschen. Für Pfade (zB rect() fügt) benötigen Sie beginPath() zu verwenden, also ein optionaler Ansatz wäre:

map_context.beginPath(); 
map_context.rect(32,32,192,192); 
map_context.fill();