我想是,上传图片,然后先在canvas里面预览,然后确定了之后再提交上去,但是把图片绘制到canvas里面的时候出了点问题,麻烦各位大神帮我看看是怎么回事,感激不尽!
var a = inputObj.files[0];
if(isAvaiable() && isImage(a))
{
var b = new FileReader;
b.readAsDataURL(a);
b.onload = function (e) {
var image = new Image;
image.src = e.target.result;
image.onload = function () {
console.log("canvas's width : " + edgeLen + "\n"); //canvas是正方形的,edgeLen是它的边长,打印出来是421
console.log("image's width : " + image.width + "\n"); //图片宽度,打印出来是1024
console.log("image's height : " + image.height + "\n"); //图片高度,打印出来是768
console.log("changed image's height : " + image.height * edgeLen / image.width + "\n");//根据比例来算出画在canvas上面高度,打印出来是315.75
var ctx = drawObj.getContext("2d");
var imgWidth = image.width;
var imgHeight = image.height * edgeLen / imgWidth;
ctx.drawImage(image, 0, 0, edgeLen, imgHeight);//用这个画,出来的图像像是在图片上从0,0开始截了一部分出来
//ctx.drawImage(image, 0, 0, edgeLen, 149.5);//用这个画就能全部显示出来,并且占满整个canvas
};
}
}