Question

I’m currently using pdf.js for my project to render PDFs.

Now there is this tricky task to highlight a section of a PDF page given the coordinates.

Example

Given a boundary section like [(31,35),(40,35),(40,40),(31,40)] I should highlight the given section with any primary color of choice.

How can I accomplish this task using Javascript and the pdf.js API?

Is it possible or am I sounding overambitious?

Answer 1

I found a better way to achieve this find the co-ordinate of the point in the html page

and then subtract the co-ordinate(position) of div.textLayer from it to find the co-ordinate

of the text in the pdf displayed online.

In order to find the co-ordinate of the text in actual pdf find the aspect ratio and you would

get the actual co-ordinate

example

if the pdf displayed online is 800x900 and the text co-ordinate

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

and the actual pdf size is 612x792

find the appropriate value of the area in actual pdf like this

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

and do this way for all co-ordinate found in online

i.e

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

NOTE: –

Might want to check the PDF.js API called convertToPdfPoint