深入研究HTML5实现图片压缩上传功能

}; image.onload = function() {

var w = image.naturalWidth, h = image.naturalHeight;

canvas.width = w; canvas.height = h;

ctx.drawImage(image, 0, 0, w, h, 0, 0, w, h); fileUpload();

}; reader.readAsDataURL(file);

这里需要注意的是，canvas将图片画到画布上的时候需要确定canvas的尺寸，同时设定好drawImage的参数，具体如下：

XML/HTML Code复制内容到剪贴板

dx源图像的左上角在目标canvas上 X 轴的位置。

dy源图像的左上角在目标canvas上 Y 轴的位置。

dWidth在目标canvas上绘制图像的宽度。允许对绘制的图像进行缩放。如果不说明，在绘制时图片宽度不会缩放。