angularjs以pdf格式创建/导出html视图

Question

I am using bootstrap to create a modal window, in this window I have some information, some tables and text areas, is it possible to create an .pdf from this .html modal view?

I looked into FileSaver, but this only works well for downloading tables, what I want is almost like a printscreen of the modal window.

Answer 1

covert html to canvas using html2canvas and then use jsPdf to convert to pdf. here is example fiddle

like this

<canvas id="canvas" width="480" height="320"></canvas> 
<button id="download">Download Pdf</button>

html2canvas($("#canvas"), {
    onrendered: function(canvas) {         
        var imgData = canvas.toDataURL(
            'image/png');              
        var doc = new jsPDF('p', 'mm');
        doc.addImage(imgData, 'PNG', 10, 10);
        doc.save('sample-file.pdf');
    }
});