jsPDF
jsPDF copied to clipboard
parallax
autoPaging: 'text' messes up lineheights
"I have read and understood the contribution guidelines.".
HTML
<h2>Hi there,</h2><p>this is a <em>basic</em> example of <strong>tiptap</strong>. <br>Next up: A bullet list:</p><ul><li><p>Free Open Source Software</p></li><li><p>Plattform independent</p></li></ul><p>Let’s try a code block:</p><pre><code class="language-css">
body {
background-color: rgba(200,200,24,1);
}
</code></pre><p>1 Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt </p>
JSPDF
doc.html(editorcontent, {
callback: (doc) => { },
x: 0,
y: 0,
margin: [20,20,20,20],
width :400,
windowWidth:420,
autoPaging: 'text', //text, slice, false
});
As you can see in the following screenshots the < em > and the < strong > tags as well as < code >< pre > tag are messed up somehow.
autoPaging: slice :+1:
autoPaging: text :-1:
i am using "jspdf": 2.5.1 "node": 16.13.2
look at using the html2pdf library instead of jspdf. autopaging works with it
thx for the tipp but htm2pdf uses html2canvas and creates an image embedded in the pdf.. so i get 400k files instead of 4k files and you can not select the text.. or did i miss an option to create a real "text - pdf"
try not setting the bottom margin. i noticed having autopaging set to text and margin bottom 0, it would work sometimes
unfortunately this doesn't help.. i've been doing 2 hours of trial and error and played with all settings i could find.
BUT i was finally able to find something that at least points into the right direction
it's the amount of pages !???
the more pages the final pdf is going to have the bigger is the top margin (or line-height) for < em > or < strong > oh.. and it has nothing to do with < em > .. every html tag is sufficient to produce the error.. for examle < span >
the attached txt file contains example code that produces the effect.. if you remove one of the lines with the dummy text the unwanted offset will get smaller .. if you remove all 3 of them and therefore reduce the final pdf to one single page the effect is gone.
https://github.com/parallax/jsPDF/pull/3718
This isn't really solving the original problem but it does help. It might be better to update html2canvas and add option to reorder elements based on their vertical position. I am not sure however if that is possible and what other problems that might cause.
