Overlapped annotation in PDF Viewer control

28 Oct 20251 minute to read

To get the overlapped annotations on a mouse click in a Syncfusion PDF Viewer, you can use the annotationCollection property of annotationSelect event.This event is triggered when the user clicks on an annotation in the PDF document.

Here is an example of how you can use the annotationSelect event to get the overlapped annotations on a mouse click in a Syncfusion PDF Viewer:

Standalone

<div id="e-pv-e-sign-pdfViewer-div">
    @Html.EJS().PdfViewer("pdfviewer").DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").AnnotationSelect("annotationSelected").Render()
</div>

<script>
    function annotationSelected(args) {
        console.log('Annotation selected with ID: ' + args.annotationCollection);
    }
</script>

Server-Backed

<div id="e-pv-e-sign-pdfViewer-div">
    @Html.EJS().PdfViewer("pdfviewer").ServiceUrl(VirtualPathUtility.ToAbsolute("~/PdfViewer/")).DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").AnnotationSelect("annotationSelected").Render()
</div>

<script>
    function annotationSelected(args) {
        console.log('Annotation selected with ID: ' + args.annotationCollection);
    }
</script>