JavaScript：真正调整图像大小

Question

我写了一个模块，您可以在其中执行图像处理。 也总是预览不同的过滤器等。

延伸是它应该快速拍摄所有照片。还可以 是一张像3000 x 3000像素的照片。对于预览 会花太多时间。

有没有办法将图片大小调整为200 x 200？ 我的意思是真正调整图像大小。

Answer 1

您可以使用画布在JavaScript中调整图像大小。 该图片必须与您的域托管在同一个域中。

首先，在您创建的画布上绘制图像。 您可以设置宽度和高度

document.getElementByTagName('canvas')[0].getContext(2d).drawImage....

之后，您可以将图像从canva恢复到图像标记。

document.getElementByTagName('img')[0].src=    document.getElementByTagName('canvas')[0].toDataUrl()

你可以看到这个例子： http://www.html5canvastutorials.com/tutorials/html5-canvas-image-size/