IPhone : Image shrinks on converting to base64 in cordova ios iphone

on Thursday, April 9, 2015

I'm working on a cross platform cordova project which involves uploading images to a server and displaying them on the website. The code used for obtaining the resized image from the phone memory and get the base64 data is as follows:



var image = new Image();
image.src = URL;
image.onload = function () {

var canvas = document.createElement("canvas");
var img_width = this.width;
var img_height = this.height;
canvas.width =1000;
canvas.height = 1000;

var w=(1000/img_width);
var h=(1000/img_height);

var ctx = canvas.getContext("2d");
ctx.scale(w,h);
ctx.drawImage(this,0,0);

var dataURL = canvas.toDataURL("image/png",1);


Here, the problem is that, the image width is set as the canvas width but the height isnt. Also, the code works perfectly on android devices and ipads, but the issue arises only on iphones.


Tested on Iphone 4s and 5c Can Anyone Please Help Me!!!!


The input image is:


Image from the phone


The image output on the canvas( as png file ) is:


enter image description here


0 comments:

Post a Comment