Having trouble getting help?
Contact Support
Contact Support
Extract text using extractTextCompleted Event
2 Apr 20252 minutes to read
The PDF Viewer library allows you to extract the text from a page along with the bounds. Text extraction can be done using the isExtractText property and extractTextCompleted event. extractTextCompleted
event Triggers when an text extraction is completed in the PDF Viewer.
Here is an example of how you can use the extractTextCompleted event:
@using Syncfusion.EJ2
@{
ViewBag.Title = "Home Page";
}
<div>
<!-- Render PDF Viewer -->
@Html.EJS().PdfViewer("pdfviewer").DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf").Render()
</div>
<!-- Ensure necessary Syncfusion scripts and styles are included -->
<script src="https://cdn.syncfusion.com/ej2/29.1.33/dist/ej2.min.js"></script>
<script type="text/javascript">
window.onload = function () {
// Initialize PDF viewer instance
var viewer = document.getElementById('pdfviewer').ej2_instances[0];
// Set up the event handler for text extraction completion
viewer.extractTextCompleted = function (args) {
console.log('Extracted Text Completed');
// Log the extracted text collection
console.log(args.documentTextCollection);
// Access text data from page 1 (0-based index)
console.log(args.documentTextCollection[1]);
console.log(args.documentTextCollection[1][1].TextData); // Extracted text data from the second element (adjust index based on your need)
console.log(args.documentTextCollection[1][1].PageText); // Text from the page
// Extract and log the bounds of the first text in the page
console.log(args.documentTextCollection[1][1].TextData[0].Bounds);
};
// Optionally, trigger the text extraction (for example, from page 1)
viewer.extractText(1, 'TextOnly').then(function (val) {
console.log('Extracted Text from Page 1:');
console.log(val);
});
};
</script>