How to calculate jsPDF font size scale factor?

user_1087973 0
Viewed 426

I'm using the master branch of jsPDF in an iOS browser. My initialization is:

const doc = new jsPDF({
    unit: 'in',
    format: [5.5, 8.5],
    precision: 10,
    putOnlyUsedFonts: true
})

doc.setFontSize(20)

I want the PDF to mimic the text elements in my HTML which use px units. setFontSize() accepts parameters as pt values right? So if my HTML text element is 20px in css, what do I send to setFontSize()? Is the original global unit setting in the constructor have anything to do with the setFontSize() method? I find that multiplying my css px value by ~1.6-1.7 gets the generated PDF to better match font sizing in my HTML. So if my html text element has font-size: 20px, I call doc.setFontSize(33) But that was just me constantly changing the multiply factor and eyeing the result. I'm trying to find an exact method.

Does the device PPI/DPI factor in? The dimensions of my HTML container element? The dimensions of the PDF page?

jspdf data-conversion font-size
1 Answers

Text is Nominally measured in printers points, thus 20 pt Font will be 5/18"

enter image description here

The calculation for nominal screen dpi is based on a default 96 pixel default per inch. Thus in a PDF the default height will be 133% larger unit wise so 20 pt will appear to be 26.67px

However its not that simple because it depends on screen resolutions so the captured text at 120dpi will be more than 33 pixels high (120/3.6 =33.333)

enter image description here

user_108025270
Related