HTML(Single Dom Element) to PDF in Front End(using JS)
Dependencies
- MrRio/jsPDF: To generate a PDF
- niklasvh/html2canvas: To generate image from HTML(Dom element)
- eKoopmans/html2canvas: Customed built with ability to custom resolution, for more details: reference
Core Code
html2canvas(document.getElementById('some-element-id'), {
scale: 2, // customised built option by eKoopmans
dpi: 192, // customised built option by eKoopmans
onrendered: function(canvas){
let img = canvas.toDataURL('image/png');
let doc = new jsPDF();
let width = doc.internal.pageSize.width-20;
let height = doc.internal.pageSize.height;
doc.addImage(img,'JPEG', 10, 10, width, height);
doc.save('output.pdf');
},
}
)