JavaScript:实时调整图像大小

JavaScript: Real resizing for images

本文关键字:图像 调整 实时 JavaScript      更新时间:2023-09-26

我编写了一个模块,可以在其中执行图像操作。也总是有不同过滤器的预览等等

无厘头的是,所有的画面都应该很快。也可以是一张3000 x 3000像素的图片。对于会花费太多时间。

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

您可以使用画布在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/