Skip to content

Commit bcc4a16

Browse files
834567: How to Add Rectangle Annotations Using Search Text Bounds
1 parent 9aaa2ed commit bcc4a16

File tree

2 files changed

+37
-14
lines changed

2 files changed

+37
-14
lines changed

How to/Get Co-ordinates of Annotations/index.html

Lines changed: 14 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -4,25 +4,28 @@
44
<meta name="viewport" content="width=device-width, initial-scale=1.0">
55
<meta name="description" content="Typescript PDF Viewer Control">
66
<meta name="author" content="Syncfusion">
7-
<link href="https://cdn.syncfusion.com/ej2/27.2.2/ej2-base/styles/material.css" rel="stylesheet">
8-
<link href="https://cdn.syncfusion.com/ej2/27.2.2/ej2-pdfviewer/styles/material.css" rel="stylesheet">
9-
<link href="https://cdn.syncfusion.com/ej2/27.2.2/ej2-buttons/styles/material.css" rel="stylesheet">
10-
<link href="https://cdn.syncfusion.com/ej2/27.2.2/ej2-popups/styles/material.css" rel="stylesheet">
11-
<link href="https://cdn.syncfusion.com/ej2/27.2.2/ej2-navigations/styles/material.css" rel="stylesheet">
12-
<link href="https://cdn.syncfusion.com/ej2/27.2.2/ej2-dropdowns/styles/material.css" rel="stylesheet">
13-
<link href="https://cdn.syncfusion.com/ej2/27.2.2/ej2-lists/styles/material.css" rel="stylesheet">
14-
<link href="https://cdn.syncfusion.com/ej2/27.2.2/ej2-inputs/styles/material.css" rel="stylesheet">
15-
<link href="https://cdn.syncfusion.com/ej2/27.2.2/ej2-splitbuttons/styles/material.css" rel="stylesheet">
16-
<link href="https://cdn.syncfusion.com/ej2/27.2.2/ej2-notifications/styles/material.css" rel="stylesheet">
7+
<link href="https://cdn.syncfusion.com/ej2/28.1.33/ej2-base/styles/material.css" rel="stylesheet">
8+
<link href="https://cdn.syncfusion.com/ej2/28.1.33/ej2-pdfviewer/styles/material.css" rel="stylesheet">
9+
<link href="https://cdn.syncfusion.com/ej2/28.1.33/ej2-buttons/styles/material.css" rel="stylesheet">
10+
<link href="https://cdn.syncfusion.com/ej2/28.1.33/ej2-popups/styles/material.css" rel="stylesheet">
11+
<link href="https://cdn.syncfusion.com/ej2/28.1.33/ej2-navigations/styles/material.css" rel="stylesheet">
12+
<link href="https://cdn.syncfusion.com/ej2/28.1.33/ej2-dropdowns/styles/material.css" rel="stylesheet">
13+
<link href="https://cdn.syncfusion.com/ej2/28.1.33/ej2-lists/styles/material.css" rel="stylesheet">
14+
<link href="https://cdn.syncfusion.com/ej2/28.1.33/ej2-inputs/styles/material.css" rel="stylesheet">
15+
<link href="https://cdn.syncfusion.com/ej2/28.1.33/ej2-splitbuttons/styles/material.css" rel="stylesheet">
16+
<link href="https://cdn.syncfusion.com/ej2/28.1.33/ej2-notifications/styles/material.css" rel="stylesheet">
1717

1818
<!-- Essential JS 2 PDF Viewer's script -->
19-
<script src="https://cdn.syncfusion.com/ej2/27.2.2/dist/ej2.min.js" type="text/javascript"></script>
19+
<script src="https://cdn.syncfusion.com/ej2/28.1.33/dist/ej2.min.js" type="text/javascript"></script>
2020
<script src="https://cdn.syncfusion.com/ej2/syncfusion-helper.js" type ="text/javascript"></script>
2121

2222
<script src="https://cdn.syncfusion.com/ej2/syncfusion-helper.js" type ="text/javascript"></script>
2323
</head>
2424
<body>
2525
<div id="container">
26+
<button id="searchText">Search Text</button>
27+
<button id="searchNext">Search Next</button>
28+
<button id="searchCancel">Cancel Search</button>
2629
<div id="PdfViewer" style="height:500px;width:100%;"></div>
2730
</div>
2831

Lines changed: 23 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,31 @@
11
var pdfviewer = new ej.pdfviewer.PdfViewer({
22
documentPath: 'https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf',
3-
resourceUrl:'https://cdn.syncfusion.com/ej2/27.2.2/dist/ej2-pdfviewer-lib'
3+
resourceUrl:'https://cdn.syncfusion.com/ej2/28.1.33/dist/ej2-pdfviewer-lib'
44
});
55
ej.pdfviewer.PdfViewer.Inject(ej.pdfviewer.TextSelection, ej.pdfviewer.TextSearch, ej.pdfviewer.Print, ej.pdfviewer.Navigation, ej.pdfviewer.Toolbar,
66
ej.pdfviewer.Magnification, ej.pdfviewer.Annotation, ej.pdfviewer.FormDesigner, ej.pdfviewer.FormFields, ej.pdfviewer.PageOrganizer);
77
pdfviewer.appendTo('#PdfViewer');
88

9-
pdfviewer.annotationAdd = function (args) {
9+
pdfviewer.textSearchHighlight = function(args){
1010
console.log(args);
11-
};
11+
var pageNumber = args.pageNumber;
12+
var bounds = args.bounds;
13+
pdfviewer.annotation.addAnnotation("Rectangle", {
14+
offset: {x: bounds.left, y: bounds.top},
15+
pageNumber: pageNumber,
16+
width: bounds.width,
17+
height: bounds.height,
18+
});
19+
}
20+
21+
document.getElementById("searchText").addEventListener("click",function(args){
22+
pdfviewer.textSearchModule.searchText('PDF',false);
23+
})
24+
25+
document.getElementById("searchNext").addEventListener("click",function(args){
26+
pdfviewer.textSearch.searchNext();
27+
})
28+
29+
document.getElementById("searchCancel").addEventListener("click",function(args){
30+
pdfviewer.textSearch.cancelTextSearch();
31+
})

0 commit comments

Comments
 (0)