How to create PDF with contents from an Angular view?

Viewed 2451

I have an Angular app that uses ngx-charts to render some graphs, for example:

Demo chart

Now I want to export this view and its graphs to a PDF file, but at the moment I'm not sure how to tackle this.

Is there a way to export this view's HTML to PDF, or are there other ways to produce PDF files based on a view?

ADDITIONAL QUESTION: imagine I have to render the view and generate the PDF backend side, without user interation, how would you handle this?

1 Answers

By far you have the best chances with this library: jsPDF

or you can try to do something from this code :

print(){  
  var canvas = document.getElementById(id) as HTMLCanvasElement;
  var dataURL = canvas.toDataURL();
  let popupWin,printContents;
  popupWin = window.open('', '_blank', 'top=0,left=0,height=100%,width=auto');
  popupWin.document.open();
  popupWin.document.write(`
    <html>
      <head>
        <title>${title}</title>
        <style>
        </style>
      </head>
  <body width="100%" height"="100%" onload="window.print();window.close()"><img src="${dataURL}" width="600px" height="auto"></body>
    </html>`
  );
  popupWin.document.close();
  }

in short create a canvas and print that out (and save as pdf)

Related