How to access Scroller of PdfViewer?

[Christine]

Hello

is it possible to access the scroller of a PdfViewer and bind to its event?

I see an embedded km-scroll-container, but cannot find out, how to control it, similar to that:

Automatic km-scroll-container events in Kendo UI for jQuery | Telerik Forums

 

I want to be able to zoom to the center of a pdf page instead of the top left corner and would therefore calculate the translation at the resize-event and set the offset then.

Or is there an other solution for that problem?

Thanks

Christine

[Neli]

Hello Christine,

You can get a reference to the built-in scroller in PDFViewer and use its methods as demosntrated below:

pdfViewer._scroller.scrollTo(0, -500);

Here is a Dojo where the above is demonstrated.

Regards,
Neli
Progress Telerik

[Christine]

Hello Neli

thanks for your answer.

I can confirm that I can access the scroller in that way. But: I have a problem with the vertical scroll position for documents with a higher number of pages.

I added the following to the Dojo:

pdfViewer._scroller.bind("scroll", onChangeScroll_Pdf);

function onChangeScroll_Pdf(e) {
        console.log("--- onChangeScroll_Pdf: " + e.scrollLeft + "/" + e.scrollTop);
  }

 

If I use your sample document, the values for scrollTop seem fine - if I go to the last page, change the zoom, pan it, move to the bottom of the last page (by wheel), zoom again and so on. Everything is fine.

The values for scrollTop at the bottom position are: 1470 / 2754 / 4038 / 9174 for the zoom scales of 100% / 150% / 200% / 400%. 

Than I loaded one of my documents with 58 pages and do the same procedure: go to the last page and note the values for scrollTop.

Now I get: 64816 / 66079 / 67342 / 72393 for the same zoom scales of 100% / 150% / 200% / 400%. 

 

Same effect with a document with 34 pages.

Values here: 36803 / 38418 / 39681 / 44733

 

You can reproduce it that way:

Add the output and watch it in the console.

- load a document with 30 or 50 pages

- page through it (page by page) -> everything fine

- jump to the beginning

- jump to the end

- change the zoom

- jump to the end <- this value is wrong

- if you jump to the beginning and page through it again, it is ok again

 

As I use the values of e.scrollTop to find my last position, I am not sure how I can solve my problem, it that value is not reliable...

 

Regards,

Christine

 

                

[Neli]

Hi Christine,

I am not sure I understand the issue correctly. What behavior are you trying to achieve when you scroll to the bottom the PDF file? I followed the described steps and you can see the behavior on my side in the screencast linked here. However, even after I followed the steps from your email, jumped to the end, zoom in and zoom out, when the PDF file is at its bottom the scrollTop value is always around 50000 on my side, but it is not 60k or 70k. Here is the Dojo I used in the screencast. Please let me know if I am missing something. 

Regards,

Neli

[Christine]

Hi Neli

at the end of your screencast, jump to the first page and page then to the last - page by page. Have a look at the scrollTop value then. It is much higher then 50000 for higher zoom values.

Regards

Christine

[Neli]

Hi Christine,

I will need some additional time to review the issue and the provided steps. I will get back to you with more infromation once I have something to share.

Thank you very much for your patience.

Regards,

Neli

[Neli]

Hi Christine,

Thank you for your patience.

I discussed the issue with a developer from the team. However, currently the PDFViewer uses a mobile scroller where such issues are  expected. There is a logged Feature Request for improving the scrolling functionality and I added your scenario to the item.

- https://feedback.telerik.com/aspnet-core-ui/1446679-pdfviewer-scrolling-improvements

I would encourage you to cast a vote for the request. Depending on the votes the issue get, it could take precedence over other issues in our queue. 

Regards,

Neli

[Christine]

Thanks Neli.

[Mark]

Update:

pdfViewer.pdfScroller.element.scrollTo(0, -500);