Exporting PDF with jspdf not rendering CSS

Question

I am using jspdf debug js to export different data from a website but there are a few problems  I can t get it to render the CSS in the exported PDF and if I have an image in the page I am exporting  the PDF returns blank     Does anyone know a way to fix this    Here is a jsfiddle showing it s not rendering the CSS  And my script     document  ready function         export   click function    var d   new Date   toISOString   slice 0  19  replace  - g               filename    financiar     d     pdf           pdf   new jsPDF  p    pt    letter            specialElementHandlers                 editor   function  element  renderer                   return true                         pdf fromHTML                export   get 0     HTML element           25     x coord           25     y coord                            width   550    was 7 5  max width of content on PDF               elementHandlers  specialElementHandlers                      pdf save  filename

User · Answer

To remove black background only add background-color  white  to the style of

User · Answer

As I know jsPDF is not working with CSS and the same issue I was facing   To solve this issue  I used Html2Canvas  Just Add HTML2Canvas JS and then use pdf addHTML   instead of pdf fromHTML     Here s my code  no other code     var pdf   new jsPDF  p    pt    letter     pdf addHTML     ElementYouWantToConvertToPdf   0   function           pdf save  Test pdf           Best of Luck   Edit  Refer to this line in case you didn t find  addHTML

User · Answer

Slight change to  rejesh-yadav wonderful answer   html2canvas now returns a promise     html2canvas document body  then function  canvas        var img   canvas toDataURL  image png        var doc   new jsPDF        doc addImage img   JPEG   10  10       doc save  test pdf                    Hope this helps some

User · Answer

You can get the example of css implemented html to pdf conversion using jspdf on following link  JSFiddle Link  This is sample code for the jspdf html to pdf download       print-btn   click      gt        var pdf   new jsPDF  p   pt   a4        pdf addHTML document body function             pdf save  web pdf

User · Answer

jspdf does not work with css but it can work along with html2canvas  You can use jspdf along with html2canvas   include these two files in script on your page     lt script type  text javascript  src  html2canvas js  gt  lt  script gt     lt script type  text javascript  src  jspdf min js  gt  lt  script gt     lt script type  text javascript  gt    function genPDF          html2canvas document body      onrendered function canvas       var img canvas toDataURL  image png       var doc   new jsPDF       doc addImage img  JPEG  20 20      doc save  test pdf                         lt  script gt    You need to download script files such as  https   github com niklasvh html2canvas releases https   cdnjs com libraries jspdf  make clickable button on page so that it will generate pdf and it will be seen same as that of original html page    lt a href  javascript genPDF    gt Download PDF lt  a gt      It will work perfectly

[jquery] Exporting PDF with jspdf not rendering CSS

Examples related to jquery

Examples related to css

Examples related to rendering

Examples related to jspdf