如何从pdf.js中的用户选择中检索文本? [英] How do I retrieve text from user selection in pdf.js?

问题描述

此问题特定于pdf.js，这是一个基于javascript的pdf渲染器.我正在构建一个自定义版本，我需要在其中提取在pdf中选择的文本.

This question is specific to pdf.js, a javascript based pdf renderer. I'm building a custom version where I need to extract the text that I select inside the pdf.

还有其他帖子，您可以从其中一页或整个pdf文档中获取文本，例如

There are other posts where you can fetch the text from one page or the whole pdf document such as the one here , but I'm looking to grab a specific text that the user selects and perhaps alert it or print it in the console.

推荐答案

您正在寻找的是 window.getSelection()方法.此方法返回特定的Selection对象，其中包含网页上所选文本的范围.

What you are looking for is window.getSelection() method. This method returns a specific Selection object with the range of the selected text on the web page.

在这里，您可以将getSelection()与 pdf.js :

Here is how you can use getSelection() together with pdf.js:

function getHightlightCoords() {
var pageIndex = PDFViewerApplication.pdfViewer.currentPageNumber - 1; 
var page = PDFViewerApplication.pdfViewer.getPageView(pageIndex);
var pageRect = page.canvas.getClientRects()[0];
var selectionRects = window.getSelection().getRangeAt(0).getClientRects();
var viewport = page.viewport;
var selected = selectionRects.map(function (r) {
  return viewport.convertToPdfPoint(r.left - pageRect.x, r.top - pageRect.y).concat(
     viewport.convertToPdfPoint(r.right - pageRect.x, r.bottom - pageRect.y)); 
});
return {page: pageIndex, coords: selected};
}


function showHighlight(selected) {
var pageIndex = selected.page; 
var page = PDFViewerApplication.pdfViewer.getPageView(pageIndex);
var pageElement = page.canvas.parentElement;
var viewport = page.viewport;
selected.coords.forEach(function (rect) {
  var bounds = viewport.convertToViewportRectangle(rect);
  var el = document.createElement('div');
  el.setAttribute('style', 'position: absolute; background-color: pink;' + 
    'left:' + Math.min(bounds[0], bounds[2]) + 'px; top:' + Math.min(bounds[1], bounds[3]) + 'px;' +
    'width:' + Math.abs(bounds[0] - bounds[2]) + 'px; height:' + Math.abs(bounds[1] - bounds[3]) + 'px;');
  pageElement.appendChild(el);
});
}

这篇关于如何从pdf.js中的用户选择中检索文本?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！