Not able to add image to generated pdf using jsPDF in cordova ios

[AmulyaKota]

Hi,
I need to generate a pdf and export data(including images) to the generated pdf in ios cordova by using the file transfer. I got succeded in generating pdf and writing normal text but not images. When I have tried to export image I got success alert in "writer.onwrite" function but not finding the image in the pdf. But the pdf file size got incremented.
Can anyone please help me.
Thanks in Advance

[davidnormo]

I also got the same problem building for Android. I can output the jsPDF object to a file on the system but when I take a look the image is a grey square.

[diegocr]

I had the same problem, a solid square in place of the image, until i realized the issue was caused due clientWidth/clientHeight wasn't available on the element (eg, img node) being passed to addImage()

So... the obvious question is, are you passing such a element to addImage()? If so, that was fixed a few days ago: 53a89bf

[davidnormo]

Thanks @diegocr, I tried using an Image object but it's the same problem. Here is my code snippet.

window.resolveLocalFileSystemURI(photoUrl, function(entry) {
    entry.file(fileSuccess, fail);
}); 

var fileSuccess = function(file) {
    var reader = new FileReader();
    reader.onloadend = function(e) {
        var base64 = 'data:image/jpeg;base64,' + window.btoa(e.target.result);
        var image = new Image();
        image.onload = function() {
            alert('image loaded');
            pdfObj.addImage(image, 'JPEG', 0, 0, 180, 180);
        };  
        image.src = base64;
    };  
    reader.readAsBinaryString(file);
};  

Before I used an Image object, I passed in the raw binary:

window.resolveLocalFileSystemURI(photoUrl, function(entry) {
    entry.file(fileSuccess, fail);
}); 

var fileSuccess = function(file) {
    var reader = new FileReader();
    reader.onloadend = function(e) {
        pdfObj.addImage(e.target.result, 'JPEG', 0, 0, 180, 180);
    };  
    reader.readAsBinaryString(file);
};  

Both produce the same result, a grey square in the top left corner of the pdf, with the right dimensions.

[davidnormo]

@AmulyaKota @diegocr worked it out. I needed to pass the 'blob' parameter to output rather than raw binary. Hope that helps!

var fsSuccess = function(fs) {
    fs.root.getFile('test.pdf', {
        create: true,
        exclusive: false
        }, file2Success, fail);
    };

    var file2Success = function(entry) {
        entry.createWriter(function(writer) {
            writer.write(reportPDF.output('blob'));
            writer.onwriteend = function() {
                alert('write complete');
            };
        },
        fail
    );
};

window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, fsSuccess, fail);

[mrfaceboy]

"window.requestFileSystem is not a function" i keep getting this error when i try the above solution. was there a change in the past 2 years?