React pdf PDFViewer generates iframe for the preview of the doc. However, on the original site of react-pdf.org, they display it in svg which is quite nice. Any idea, how to do it?
I think they used another library to display their output. I found another library named react-pdf https://www.npmjs.com/package/react-pdf. I compared these examples:
#react-pdf/renderer
react-pdf
In the HTML section for displaying pdf, both use the same class names. Moreover, regarding the documentation of #react-pdf/renderer example only shows way to generate a file using ReactPDF.render. react-pdf allows to render document as SVG.
Related
I am reviewing the Strapi tutorial on building a blog with Nextjs with Strapi. tutorial here
They indicate that a package for the markdown format must be downloaded.
And here is where it is used:
And the result is this:
I just took a screenshot where the iframe element is not rendering. What I think is that it is necessary to use a tool that works for mdx but I don't know how.
I am generating pdf using react-to-print library,
But i want to break the page in new page,
There is css property break-after:always, it can work, but not all major browser supports it now,
Anyone know any other method then brute force margin ?
Working with pdf is hard, specially css part.
https://www.npmjs.com/package/react-to-print
https://developer.mozilla.org/en-US/docs/Web/CSS/break-after
I would like to recommend to use React PDF npm library. Please check https://react-pdf.org
I have been using the recharts library for the dashboards in a NextJs app and a new requirement came through to download tables and charts through a PDF.
On the github for the react-pdf there was an issued raised that has now been closed due to the newly release of SVG support in the package where the author states the bindings should be done separately and people have achieved this.
Solved GitHub issue: https://github.com/diegomura/react-pdf/issues/669
SVG example: https://react-pdf.org/repl?example=svg
So far I have go the PDF rendering simple content such as text. Note: to get the react-pdf to work in this sandbox you might need to open it in a new window.
https://codesandbox.io/s/simple-line-chart-forked-vifo9?file=/src/App.tsx
I am working on react ja project which is contains pdf file download. I have list view which is contains some get service data from the api, exactly on the list view I have download button. If I click on the download button the list view should download as pdf file.
I have no idea how to that, so how to generate pdf file in react js?
There are two older answers for this in stackoverfow.
First one is this.
How to make PDF from React?
Second one is how to use jsPDF properly. And there is a working jsfiddle example allso. Refer them.
How to properly use jsPDF library
I created a html table using angularjs. I am able to download the document as pdf using pdfmake and html2canvas based on this question:
Generate PDF from HTML using pdfMake in Angularjs
The document layout is nice and everything works fine until it comes to documents that goes beyond a single page. In that case the pdfmake generates a blank (2 pages) pdf document.
How can I handle the generation of a multipage document with pdfmake and html2canvas?
I found the root cause of the problem. When the image generated by html2canvas is larger than one page it seems that pdfmaker is unable to handle the page split. So you have to managed output context by yourself.