Programmatic control

[William Morgenweck]

Is it possible to programmatically control the viewer and document?  Such as without using the toolbar I want to highlight a section of text, or go to a certain page or highlight a certain word.

Thanks

[Chinnamunia Karthik Chinna Thambi]

Hi William,

You can highlight text and navigate to a specific page without using the toolbar in PDF Viewer. We have provided the code snippet, sample and documentation for this functionality.

 

Code snippet:

 

      highlight: function (args) {

        var viewer = document.getElementById('pdfviewer').ej2_instances[0];

        viewer.annotationModule.setAnnotationMode('Highlight');

      },

 

      goToFirstPage: function (args) {

        var viewer = document.getElementById('pdfviewer').ej2_instances[0];

        viewer.navigation.goToFirstPage();

      },

 

      goToLastPage: function (args) {

        var viewer = document.getElementById('pdfviewer').ej2_instances[0];

        viewer.navigation.goToLastPage();

      },

 

      goToPreviousPage: function (args) {

        var viewer = document.getElementById('pdfviewer').ej2_instances[0];

        viewer.navigation.goToPreviousPage();

      },

 

      goToNextPage: function (args) {

        var viewer = document.getElementById('pdfviewer').ej2_instances[0];

        viewer.navigation.goToNextPage();

      },

 

      goToPage5: function (args) {

        var viewer = document.getElementById('pdfviewer').ej2_instances[0];

        viewer.navigation.goToPage(5);

      },

 

Sample: B5ycis (forked) - StackBlitz

 

Documentation:

 

• Navigation in Vue Pdfviewer component | Syncfusion
• Text markup annotation in Vue Pdfviewer component | Syncfusion