Yes, it has to do with the animation. You need to check for the animation being complete. Under options add:

    animation: {
    onComplete: done                   

and then create a function "done" where you handle the printing.

function done() {



Try using the .toDataURL() method on your canvas. This method returns a URL containing your chart as an image.

  • Grab your pie chart's canvas and convert it to an image: document.getElementbyId('pieChart').toDataURL;

  • Assign the generated chart image URL to a variable, let's keep using printContents in this case: let **printContents** = document.getElementbyId('pieChart').toDataURL;

  • Initiate an html document on the fly and append the previously created image URL as an <img> element's source, using template literals to embed the printContents variable: let html = <html><head><title></title></head><body><img src=${printContent}></body></html>

-Execute the print job (Chrome) by writing the previously constructed html doc to the print window on the fly:

let **printWindow** ='', 'Print-Preview', 'height=900,width=200');;



Related Query

More Query from same tag