Wie kann man Coords (x, y, w, h) eines gerenderten Canvas-Elements abrufen?

Question

Wie kann ich die Koordinaten eines gerenderten Canvas Elements erhalten? Ich brauche sie, um clearRect, fillRect usw. in ihrem Bereich anzuwenden.

Ich erhalte die Leinwand:

//html 
<div><canvas id="canvas_id">some useless text..</canvas></div> 

//javascript 
var ctx = document.getElementById('canvas_id').getContext('2d'); 

dann? gibt es eine Möglichkeit, oben links x, oben links y, Breite und Höhe davon zu bekommen?

@update nach Moonshadow ‚s Antwort:

thx für Antwort, ich weiß, dass Operationen auf die Leinwand bezogen sind, aber ich die Frage gestellt, weil ich mir dieses Verhalten nicht erklären: Ich habe getan, eine Testdatei mit einem Canvas-Objekt (http://avastreg.ilbello.com/canvas/test.html).

Hier habe ich ein Formular, in dem Dimensionen für clearRect über das Formular gesendet werden können. Wenn Sie mouseover auf der Zeichenfläche (NEWS) auslösen, wendet es clearRect mit diesen Koordinaten an. Bei Mouseout füllt er nach.

Startwert sind:

x = 0, y = 0, w = 200, h = 200. Beachten Sie, dass das nicht funktioniert.

Dann versuchen Sie so etwas wie

x: -10000, y: -10000, w: 50000000, h: 50000000 => es scheint ein Witz, aber das funktioniert!

Mit anderen Werten wird es teilweise gelöscht. Warum passiert das?

Answer 1

Die Breite und Höhe des Canvas sind in OffsetWidth und OffsetHeight.

ich verwendet habe Code wie dies in der Vergangenheit der oberen linken Ecke der Leinwand zu finden:

var canvasTop = 0; 
var canvasLeft = 0; 
var c = document.getElementById('canvas_id'); 
while(c && (c != document.body)) 
{ 
    canvasTop += c.offsetTop; 
    canvasLeft += c.offsetLeft; 
    c = c.offsetParent; 
} 

Im Allgemeinen quirksmode.org hat eine große Liste von dem, was diese Eigenschaften genannt werden, und die Browser unterstützen die .

Berücksichtigen Sie, dass für den Betrieb auf dem Grafikkontext koordiniert, wie fillRect, clearRect usw. sind in Bezug auf die Leinwand, nicht das gesamte Dokument, standardmäßig, so dass Sie nicht die Leinwand von oben hinzufügen müssen und links zu den Koordinaten, die Sie zeichnen möchten.