@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