Display Multiple pages on perspective pdf viewer

Ignition
1

I am looking to display a pdf file using pdf viewer component in perspective.
I was able to set up the pdf viewer to point to the right file, however it only displays a single page from that file.
Is there a setting that I can modify to display multiple pages or scroll through the whole file?
I wasn’t able to find it in the manual.

2

I don’t believe this is possible in Ignition Perspective as of yet. You do however have the capability to bind a property to the props page property to give your PDF viewer the ability to change pages.
I would personally use the Numeric field entry and use the bounds 1 to whatever the pageCount property is equal to, as well as giving it two buttons that will add or subtract by one page on both sides of the text entry.

Hope this helps!

2 Likes
3

Would creating multiple instances of the pdf viewer, each instance pointing to the next page, load the pdf fully for each page?

4

You can scroll through the whole file, just place a slider component and bind its value to the page property of the pdf viewer component. You should also bind back the max value on the slider to the page count property of the pdf viewer. Works just fine!

5

This is true, but it is a horrible way to read a pdf, if you want to zoom in and read finer print at the bottom of one page that continues on the top part of the next page this doesn’t work well

6

Completely agree, but those are limitations of the PDF viewer at the moment. One way to improve the PDF reading experience would be to use the webdev module to deliver the file as pdf content file so it opens on a different tab in the browser. This way the file will be opened by the browser pdf viewer which has a lot more viewing options. The down side is that the view will not be embedded within the perspective environment but on a separate tab.

7

That is not a bad idea. This PDF issue had me thinking, what if you could either load each page seperately on a different pdf viewer, or have 3 viewers which trick you into thinking that it is an continuous scroll, like when you get to the 3rd viewer the 2nd one is updated and the scroll takes you to the 2nd one as if it was the page on the 3rd one

8

Just use two new button components, one for going to the Previous page and another for going to the Next page. Inside the component scripting section of the buttons select the page and pageCount props of the pdf viewer and increment and decrement them by one.

This is a simple script for Previus button :

self.parent.parent.getChild("PDFViewer").props.page=self.parent.parent.getChild("PDFViewer").props.page-1

for Next button:

self.parent.parent.getChild("PDFViewer").props.page = self.parent.parent.getChild("PDFViewer").props.page + 1

You can also add the visibility props to those buttons, moreover you can show or hide the visibility based on the active number of the padf page.

9

Welcome to the forum, Md.

Note that the forum editor has a button for formatting code:

Formatting code
Formatting code741×191 17.4 KB

1 Like
10

Thanks, Man for helping. I am not new to the forum but that was my first comment in the forum section.