将图像绘制到画布中

Question

我正在使用HTML5画布创建图像查看器应用程序。我已经使用了两个画布，第一个用于将实际宽度和高度的图像加载到用户未显示的图像中（这是一个未添加到DOM树中的隐藏画布），第二个实际呈现给用户。图像的实际分辨率是1200 * 800。我将图像加载到尺寸为1200 * 800的隐藏画布上。然后我尝试将图像加载到分辨率为700 * 600的可见画布中（我添加了像ctx.drawImage（hiddenCanvas，0,0,700,600）这样的代码。我可以看到在这个分辨率下的整个形象。我有以下问题。

1. 将它保持宽高比装入可见帆布什么时候？或者，我们做手工长宽比操作。
2. 会失去图像的质量这是做imageviewer应用程序的标准方法吗？

我必须添加放大，缩小，泛像功能进入这个观众。

请任何人都可以回答我的问题。

Answer 1

当您说,0,0,700,600时，您会自动指定宽高比。

大多数调整大小操作会降低图像质量。如果将1200x800图像调整为700x600，将会执行某种插值（线性，双三次等）。

Answer 2

可以使用

var name=new Image(); 
name.src="name.fileformat"; 
context.drawImage(name,X, Y, sizeX, sizeY); 

但对于平移，缩放和其他人我没有什么“回合”时间。