javascript - jsPDF and image loading -

i'm tryna use jspdf library. i'd load , insert image, , export pdf file.

my issue image loading. i'm doing this: var imagedata = getbase64image('thinking-monkey.jpg'); , should dataurl in base64 inside imagedata.

my getbase64image() function following:

function getbase64image(url) {     var img = new image();     var dataurl;      img.src = url;      img.onload = function() {         var canvas = document.createelement('canvas');         canvas.width = img.width;         canvas.height = img.height;          var context = canvas.getcontext('2d');         context.drawimage(img, 0, 0);          dataurl = canvas.todataurl('image/jpeg');      }      return dataurl; } 

but returns 'undefined', because image 65 kb , doesn't load @ once. when @ return dataurl; variable still undefined.

i've tried add settimeout() right before return dataurl; doesn't seem working.

how can wait until image loaded return dataurl?

thanks.

you can use callback. pass code want execute after image loaded getbase64image function, , execute in .onload function.

it this. (generatepdf function)

function getbase64image(url,generatepdf) {     var img = new image();     var dataurl;      img.src = url;      img.onload = function() {         var canvas = document.createelement('canvas');         canvas.width = img.width;         canvas.height = img.height;          var context = canvas.getcontext('2d');         context.drawimage(img, 0, 0);          dataurl = canvas.todataurl('image/jpeg');         generatepdf(dataurl);     } } var generatepdf= function generatepdf(imagedata){    /** function receives image param , creates pdf it**/    var doc = new jspdf();    doc.addimage(imagedata, "jpeg", 60,50);     doc.save("test.pdf"); };  function generateimagepdf(url){      getbase64image(url, generatepdf); } //now call generateimagepdf function, call generatebase64image function , wait tyhe image load call generatepdf function param generateimagepdf("imageurl.jpg") ;