Extract text in React Pdfviewer component

16 May 20231 minute 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.

Here is an example of how you can use the isExtractText property and extractTextCompleted event:

<PdfViewerComponent
    id="container"
    documentPath="PDF_Succinctly.pdf"
    serviceUrl="https://ej2services.syncfusion.com/production/web-services/api/pdfviewer"
    isExtractText={true}
    extractTextCompleted={extractTextCompleted}
    style={{ height: '640px' }}>
</PdfViewerComponent>

function extractTextCompleted(args){
    // Extract the Complete text of load document
    console.log(args);
    console.log(args.documentTextCollection[1]);
    // Extract the Text data.
    console.log(args.documentTextCollection[1][1].TextData);
    // Extract Text in the Page.
    console.log(args.documentTextCollection[1][1].PageText);
    // Extract Text along with Bounds
    console.log(args.documentTextCollection[1][1].TextData[0].Bounds);
};

Find the sample how to Extract Text