javascript - How to know if PDF.JS has finished rendering?

Question

I am using PDF.JS to render pdf pages into different canvas elements. my requirement is to capture the output of the canvas and to display it as an image. Is there some event to know if the rendering of the pdf page in canvas has been finished or not. because when I try to capture the output of canvas it is blank. but the pdf page is rendered properly. it looks like my capture event is being called before the pdf.js finishes the rendering process.

here is my code:

page.render(renderContext);
var myImage = new Image();
myImage.src = document.getElementById('my-canvas-id').toDataURL();
$('body').append(myImage);

If I execute the same code in my FireFox's console this works fine. so nothing is wrong with this code.

Just to let you people know that I already have tried document.ready and window.load events.

Answer 1

I was also struggling with this problem.. the solution that i used is:

//Step 1: store a refer to the renderer
var pageRendering = page.render(renderContext);
//Step : hook into the pdf render complete event
var completeCallback = pageRendering.internalRenderTask.callback;
pageRendering.internalRenderTask.callback = function (error) {
  //Step 2: what you want to do before calling the complete method                  
  completeCallback.call(this, error);
  //Step 3: do some more stuff
};