寫入到另一個浮動

Question

我有一個imageCanvas與它的變換矩陣

Image = new image(); 
image.src = //stuff; 
imageContext.drawImage(Image, 0, 0); 
var t = imageContext.currentTransform; 

正在另一畫布

context.drawImage(imageCanvas, 0, 0); 

上，我畫線

context.moveTo(mousePos.X, mousePos.Y); 
context.lineTo(currentPos.X, currentPos.Y); 
context.stroke(); 

繪製

我將我的線條保存到對象'線條'的矢量中。 我想將兩個圖層合併到「圖像」中，但此功能僅適用於traslation，不適用於旋轉和縮放。

var saveCanvas = document.createElement('canvas'); 
var saveContext = saveCanvas.getContext('2d'); 

saveCanvas.width = Image.width; 
saveCanvas.height = Image.height; 

saveContext.drawImage(Image,0,0); 

saveContext.save(); 
var t = imageContext.currentTransform; 
saveContext.setTransform(1,0,0,1,-t.e,-t.f); 

for(var i = 0; i < lines.length; i++){ 
    saveContext.beginPath(); 
    saveContext.moveTo(lines[i].from.X, lines[i].from.Y); 
    saveContext.lineTo(lines[i].to.X, lines[i].to.Y); 
    saveContext.stroke(); 
} 
saveContext.restore(); 

Image.src = saveCanvas.toDataURL(); 

我怎麼能修改「的setTransform」的論點來解決這個問題？

Answer 1

只需使用其餘的變換屬性。

var t = imageContext.currentTransform; 
saveContext.setTransform(
    t.a, 
    t.b, 
    t.c, 
    t.d, 
    -t.e, 
    -t.f);