图像转换错误裁剪

在我的应用程序中，我添加了代码将图像转换为具有调整大小的图像的基本64.当我尝试下面的代码图像部分已被裁剪。图像转换错误裁剪

function getBase64FromImageUrl(URL) 
{ 
var img = new Image(); 
img.style.width = this.width, 
img.style.height = this.height, 
img.src = URL; 
img.onload = function() 
    { 
    var canvas = document.createElement("canvas"); 
    canvas.width =150 
    canvas.height =150; 
    var ctx = canvas.getContext("2d"); 
    ctx.drawImage(this, 10, 10); 
    var dataURL = canvas.toDataURL("image/jpg"); 
    c=dataURL.replace(/^data:image\/(png|jpg);base64,/, ""); 
    return c; 
    } 
}

如何获得完整的图像正确的代码

来源

2013-10-19 Fazil

你是什么意思的裁剪？它只是canvas.width和canvas.height太小？另外，从onload返回c不会从getBase64FromImageUrl返回该值。 – nkron

@nkron裁剪 - 完整图像不显示，全尺寸图像中只显示特定部分 – Fazil

function encodeImage(src, callback) { 
    var canvas = document.createElement('canvas'), 
     ctx = canvas.getContext('2d'), 
     img = new Image(); 

    img.onload = function() { 
     canvas.width = img.width; 
     canvas.height = img.height; 
     ctx.drawImage(img, 0, 0, img.width, img.height); 
     callback(canvas.toDataURL()); 
    } 
    img.src = src; 
}

什么变化需要看到这个小提琴：

http://jsfiddle.net/NwaPT/3/

来源

2013-10-19 05:32:02

然后，如何在转换后调整大小后将图像转换为base64 – Fazil

当我尝试使用解码显示图像时，它不显示图像。 – Fazil

你是从文件系统运行的吗？如果是这样，请在运行本地Web服务器时再试一次。我尝试了相同的方式，并且完美地适用于我（尝试超过15张图像）。 –

图像转换错误裁剪

回答

相关问题