Quantcast
Channel: Ionic Forum - Latest topics
Viewing all articles
Browse latest Browse all 70435

How to convert HTML to PDF with multiple pages

$
0
0

@virjachoudhari504 wrote:

I am trying to convert HTML div element’s content to PDF using ionic3 Angular 4. I have tried using PDFmake(), jspdf() and html2canvas plugins. None of these working for mutliple page generation. Below is an example using PDFmake() with html2canvas plugin.

The below code generates pdf with single page. When content exceeds the data from the page is being cropped. I want the data to be continued on next page.

htmlcanvaspdf(){

      console.log('testhtmlcanvas');
      let elem = this.exportthis.nativeElement.innerHTML;
      console.log('exportthiselem'+elem);

        html2canvas(document.querySelector("#exportthis")).then(canvas => {
          console.log('canvass'+canvas);
          var data = canvas.toDataURL();
          var docDefinition = {
              content: [{
                  image: data,
                  width: 500,
                  height: 800,

              }]
          };
          console.log('doccdeff'+docDefinition);
          this.pdfObj = pdfMake.createPdf(docDefinition);
          if(this.pdfObj){

          this.downloadPdf();

          }
      });
    } 

    downloadPdf() {
      console.log('downloadPdf');
      if (this.platform.is('cordova')) {

        this.pdfObj.getBuffer((buffer) => {

          var blob = new Blob([buffer], { type: 'application/pdf' });
          var today= new Date();
          var dd =  today.getTime();
          // Save the PDF to the data Directory of our App
          this.file.writeFile(this.file.dataDirectory, 'whatappoffer'+dd+'.pdf', blob, { replace: true }).then(fileEntry => {
            // Open the PDf with the correct OS tools
            console.log('fileentry'+fileEntry);
            let filenames=this.file.dataDirectory+'whatappoffer'+dd+'.pdf';
            console.log('filearraydownloadPdf'+this.filearray+'filenames'+filenames);
            this.fileOpener.open(this.file.dataDirectory + 'whatappoffer.pdf', 'application/pdf');
          })
        });
      } else {
        // On a browser simply use download!
        this.pdfObj.download();
      }
    }

Posts: 1

Participants: 1

Read full topic


Viewing all articles
Browse latest Browse all 70435

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>