将图像绘制到画布中

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);

但是对于平底锅，变焦和其他人我没有任何关于他们的事情。