使用Pdf.js突出显示pdf内的部分

Question

我目前正在使用pdf.js进行渲染pdf的项目现在有一个棘手的任务是在给定坐标的情况下突出显示pdf页面的一部分

示例

给定像[(31,35),(40,35),(40,40),(31,40)]这样的边界部分我应该突出显示给定部分的主要颜色

如何编写javascript以实际使用pdf.js api来完成此任务

是否有可能或者我是否有超越野心

Answer 1

PDF.js的作者之一cjones已声明：

No, and that’s (highlighting) not like something we would add to pdf.js. That ought to be easy to layer on top of pdf.js.

来源：http://blog.mozilla.org/cjones/2011/07/03/pdf-js-first-milestone/

如果您对使用此功能感兴趣，则需要自己实施。

Answer 2

我找到了一个更好的方法来实现这个找到html页面中点的坐标

然后从中减去div.textLayer的坐标（位置）以找到坐标

在线显示的pdf中的文字。

为了找到实际pdf中文本的坐标，找到宽高比，你会

获得实际的坐标

示例

如果在线显示的pdf为800x900且文字坐标为

[(31,35),(40,35),(40,40),(31,40)]

，实际的pdf大小为612x792

在实际的pdf中找到适当的区域值，如下所示

(612/(800 / 31)),(792/(900/35))

并对在线

中的所有坐标采用这种方式

即

(40,35),(40,40),(31,40)

注意： -

可能要检查名为convertToPdfPoint

的PDF.js API

Answer 3

如果选择文字可满足您的需求，您可以在SO about highlighting text in PDF.js找到解决方案的条目。

通过document.getSelection()选择文字。

如您所说，可以使用

完成颜色调整

<span style="yourColorDefinition">

而不是

<span class="hightlight">