How to make Pan icon visiable always outside

WebViewer Version: 12.0.0

How to make Pan icon visiable always outside.

1 Like

Hello Lokesh,

Thank you for contacting Apryse Forums.

The following code keeps the grab icon visible even outside the document.

      documentViewer.addEventListener('toolModeUpdated', (newTool) => {
        document.body.style.cursor = newTool?.name === 'Pan' ? 'grab' : '';
      });

This approach worked in my testing, but I haven’t been able to validate every possible edge case. Please let me know if you encounter any unexpected behavior.

Best Regards,

Darian

1 Like

Thanks for the Quick reply. I tried with this code, however the pan icon is not added outside.

1 Like

Hello Lokesh,

Thank you for the response.

  1. Could you show how you are adding this code snippet in your application?
  2. Are you using React or some other framework?
  3. Was this tested locally?
  4. Are there any console errors?

Best Regards,

Darian

1 Like
  1. WebViewer({

     path: baseHref + 'lib/webviewer',
    
     licenseKey: this.commonService.aspyreKey,
    
     initialDoc: '',
    
     enableFilePicker: true,
    
     fullAPI: true,
    
     // enableOfficeEditing: true,
    
     // preloadWorker: 'contentEdit'
    

    }, this.viewer.nativeElement).then(instance => {

      documentViewer.addEventListener('toolModeUpdated', (newTool) => {
    
       document.body.style.cursor = newTool?.name === 'Pan' ? 'grab' : '';
    
     });
    

    })

  2. Angular framework i used.

  3. tested locally

  4. no console errors

1 Like

Hello Lokesh,

I noticed that you created an internal support ticket for this question. I’ll continue the discussion there and follow up on this issue through that ticket.

Best regards,
Darian

1 Like