putImageData() sul lavoro su tela ruotata non corretto

Question

Ho bisogno di disegnare dati di immagine ruotati su tela. (Questo è un progetto GWT e il contesto è istanza di com.google.gwt.canvas.dom.client.Context2d)

ho cercando di utilizzare seguente codice per questo:

context.rotate(rotation); 
context.putImageData(data, x, y); 
context.rotate(-rotation); 

ma non disegnare immagine ruotata. Se cambio codice come questo

context.rotate(rotation); 
context.fillRect(x, y, 100, 50); 
context.rotate(-rotation); 

rispetto al rettangolo ruotato verrà disegnato su tela. È un bug dell'API o il mio falt? Cosa posso fare per correggerlo?

Modificato Ho provato a utilizzare drawImage() con qualche altra immagine invece di inserireImageDate() per verificare come funziona. Funziona con rotazione fine. Ma ho bisogno di disegnare ImageData di quello che prendo forma in altri canvas. È un metodo veloce per tradurre ImageData in ImageElement? In quali unità ImageData restituisce le sue dimensioni?

Answer 1

Beh, è ​​colpa tua. putImageData non è influenzato dalla matrice di trasformazione.

Questo è di ordine del Spec:

percorso di corrente, matrice di trasformazione, attributi dell'ombra, alfa globale, l'area di visualizzazione, e operatore composizione globale non devono incidere sul getImageData() e putImageData() metodi .

Che cosa si può fare è putImageData ad una tela in memoria, e quindi

context.rotate(rotation); 
context.drawImage(inMemoryCanvas, x, y) 
context.rotate(-rotation); 

sulla tua tela regolare.

NOTA: dalla modifica sembra implicare che si possa semplicemente disegnare da una tela all'altra senza modificare alcuna immagine. Se questo è il caso, usa semplicemente drawImage(othercanvas, x, y) invece di usare getImageData e putImageData se possibile. L'utilizzo di drawImage è molto più veloce.