Syncfusion Pan Notation not working properly

Iam using syncfusion for notation but Here I have issue that When I click on Pan Option then its not working when ever I click on Ink option(pen) and After Click on PAn then Its working . Code:-

 function panFunction() {
    
   var pdfViewer = document.getElementById('pdfviewer').ej2_instances[0];       
    pdfViewer.annotation.setAnnotationMode("None");      
    pdfViewer.interactionMode = "Pan";
    pdfViewer.annotation.setAnnotationMode("Pan");
    console.log(pdfViewer);
    $("#pdfviewerSignature_tab").find(".e-tab-header.e-control.e-toolbar.e-lib.e-keyboard").hide();
    $("#pdfviewer_diagramAdorner").hide();
}

Code in Body

<div class="modal-body pd-0-force" style="width:100%">
@Html.EJS().Toolbar("topToolbar").Height("56px").Items(new List<ToolbarItem> {
   new ToolbarItem { Type = ItemType.Button, PrefixIcon = "e-pv-inkannotation-icon-blue",TooltipText = "Draw Ink",Click="drawInk1",CssClass="clickInkPen",Align=ItemAlign.Left},
   new ToolbarItem { Type = ItemType.Button, PrefixIcon = "e-pv-inkannotation-icon-red",TooltipText = "Draw Ink",Click="drawInk2" ,CssClass="clickInkPen",Align=ItemAlign.Left},
   new ToolbarItem { Type = ItemType.Button, PrefixIcon = "e-pv-inkannotation-icon-black",TooltipText = "Draw Ink",Click="drawInk3"  ,CssClass="clickInkPen",Align=ItemAlign.Left},
   new ToolbarItem { Type = ItemType.Button, PrefixIcon = "e-pv-freetext-icon",TooltipText = "Free Text",Click="addFreeText" ,CssClass="clickInkPen",Align=ItemAlign.Left},
   new ToolbarItem { Type = ItemType.Button, PrefixIcon = "e-pv-undo-icon", TooltipText = "Undo",Click="undoFunction" ,CssClass="clickInkPen",Align=ItemAlign.Left},
   new ToolbarItem { Type = ItemType.Button,  PrefixIcon = "e-pv-redo-icon" ,TooltipText = "Redo",Click="redoFunction",CssClass="clickInkPen",Align=ItemAlign.Left},
   new ToolbarItem { Type = ItemType.Button,  PrefixIcon = "e-pv-handwritten-icon" ,TooltipText = "Signature",Click="signatureFunction",CssClass="clickInkPen",Align=ItemAlign.Left},
   new ToolbarItem { Type = ItemType.Button,  PrefixIcon = "e-pv-pan-tool-icon" ,TooltipText = "Pan",Click="panFunction",CssClass="clickInkPen",Align=ItemAlign.Left},
   new ToolbarItem { Type = ItemType.Button, Text="CLOSE" ,TooltipText = "Close", CssClass="btn-close" ,Click="saveDocument", Align=ItemAlign.Right} ,
   }).Render()


@Html.EJS().PdfViewer("pdfviewer").ServiceUrl(VirtualPathUtility.ToAbsolute("~/PdfViewer/")).DocumentLoad("documentLoad").AnnotationSelect("annotationSelect").FreeTextSettings(new Syncfusion.EJ2.PdfViewer.PdfViewerFreeTextSettings { FontFamily = "Segoe UI", FontStyle = Syncfusion.EJ2.PdfViewer.FontStyle.Bold, FontSize = 26, FillColor = "#ffffff00" }).ShowNotificationDialog(false).ContextMenuOption(Syncfusion.EJ2.PdfViewer.ContextMenuAction.None).EnableToolbar(false).HideSaveSignature(true).EnableAnnotationToolbar(false).EnableNavigationToolbar(false).EnableThumbnail(false).EnableTextSearch(false).DocumentPath("").SignatureSelect("onSignatureSelect").PageClick("onPageClick").AjaxRequestInitiate("ajaxRequestInitiate").AjaxRequestSuccess("onAjaxRequestSuccess").AjaxRequestFailed("onAjaxRequestFailed").Created("created").AnnotationAdd("onAnnotationAdd").Render();