Client-side PDF Generation: If you struggled with dynamic content positioning in jsPdf
At first, I was using jsPdf to generate Report data as a part of the application. It’s very popular and well documented, but when I came across the needs of the dynamic content, I found it not as simple as I thought.
The case is every element on jsPdf is needed to set its x and y position on the page. So, to add the next element below it, we need to specify current y to be greater than the y on the previous element. The problem is, we never know the length of the element. It causes the height of an element may vary, and I can’t find the proper way to calculate the height of the dynamic text.
After spending hours on the surf, I concluded the best solution for that kind of problem is to change the tools, my favorite one is pdfMake. I have tried to make this layout with it:
Here are 5 Reasons why you need to use pdfMake:
1. Auto-positioning without the hassle
With pdfMake, you don’t need to set x and y to every element. The positioning will follow the document structure and it has some useful features to utilize, e.g. margin, alignment, etc. It’s also documented well here.
2. Supports the <svg> Element
If you need any simple graphic for your document, I recommend you to use HTML SVG features instead of creating graphic externally.
coming soon