I'm trying to convert a web page content into a PDF and I've successfully done it with jsPDF + html2canvas and with html2pdf but the problem with both approaches are that they convert the content into an image and then generate the PDF off the image and I need the PDF content to be "selectable" because I need to pass certain tags that will be read by another application.
so far I haven't found anything that would allow me to do this with jquery/javascript.
Any ideas how to accomplish this?
Thanks in advance,
Related
Using NativeScript + VueJS, I'm trying to find a way to take a dynamic template that's rendered based on props and route data, and tap a button to save the "view" as a PDF to the filesystem.
I found this tutorial here which gives me a start: https://medium.com/#kumarandena/pdf-generation-in-nativescript-using-javascript-libraries-864ecf4e9a3a
This generates a Base64 which you then copy to clipboard and open in a browser. In iOS for example if I choose to save the page as a file it's just unknown.pdf. So my goal is to reference an html element, like a div, and save all the contents exactly as they appear into a folder of my choice in the native file system.
There's little to find on this so wondering if someone has accomplished this.
I use domtoimage to convert any dom element to an image, and it works well. Then you can probably insert that image to a pdf using jsPDF or pdfMake.
I see in the pdfMake playground that you can insert an image with a dataurl format.
Is there a node.js module or a javascript library that can convert HTML/Page into PDF with selectable texts and working links? I've tried Phantomjs. But since its the only screenshot the page and convert it to pdf, texts are not selectable and links are not working. Also tried jsPDF but links are not working either. Hope you guys can share some of your experience in dealing the same problem.
Your response is greatly appreciated.
You can parse the HTML body with htmlparser. The complete html will be properly converted to JSON.
Depending upon the keys, you can then write it to a PDF using pdfkit.
This is very general solution. If you give us an insight as to what type of HTML you want to get into a PDF, maybe then we would be able to help with some specific code or logic.
Try http://www.cloudformatter.com/css2pdf.
Their links demo at http://www.cloudformatter.com/CSS2Pdf.Demos.Hyperlinks shows external links and internal links within the generated PDF.
The system I am working on has a questionnaire in it and then shows the responses to the admin in a nice report on screen. I need to create functionality that turns the on screen report into a pdf, similar to how the browser generates a pdf of the page when you select print. Although I need to only turn a section of the page into pdf. And it would be ideal to be able to alter the HTML so that the pdf page breaks don't interfere with the presentation of the report.
You can download a pdf of how the report looks, generated by the browser functionality. This is just an example, I need the pdf to be generated by a link or button and not include the whole page (the top part in this case).
I have tried some php HTML to pdf generators, but it's difficult because the HTML is dynamically generated so I'm not sure how to send all the HTML, once rendered, to the page that creates the pdf.
To overcome the page breaks, I've considered using javascript or jquery to read the height of the div of each question within the report and then write a simple script to calculate if the next div will fit on the page and if not add a margin on top of that div so that it starts on a new page.
What software can I use to generate the pdf, given these requirements? Either php or javascript. Appreciate the help.
Have you considered Snappy for PHP? It makes use of wkhtmltopdf behind the curtains to convert any HTML document into PDF.
We are using it and it works great.
https://github.com/KnpLabs/snappy
You could try mpdf and use the page-break-inside: avoid property which is actually a CSS property. I have not used this, but it might be what you're looking for.
Looks like you can add this property to the <div> and <table> tags (mPDF Supported CSS).
I need to create image chart dynamically as shown bellow,
First I tried with php ImageCreate but it is hard to manage the space with that.
Then I tried the html5 canvas and that is also having a same issue. What I need to know is whether there is an easy way to do html to image conversion. Then I can manage the space easy with other styles.
Thanks in advance.
With wkhtmltoimage you can convert HTML to an images. You would need a VPS to run it on though. You can then create the HTML and call wkhtml2image via PHP to convert the given HTML to an image.
I am creating dynamic image with php with `GDLibrary. Here is the script of creating dynamic image.
I have some SVG element in my HTML page with some HTML controls. I want to export all in a pdf. The export need to be "correct", I can't, for example, create a picture and create a pdf from it. And the html text need to keep this format, it have to stay selectionnable.
I saw jspdf but it seems hard with SVGs.
So, have you got an idea to do this?
Just for information I work with Phonegap / Angular js on mobile platforms.