Ng2-pdf-viewer: Make text selectable ?

[Vi-dot]

Hello,

I don't know if it's because ng2-pdf-viewer use a canvas, but we can't select text in the pdf viewer.
Someone has an idea to make it available ?

Thanks

[VadimDez]

Similar to #18

[mmaclach]

i've implemented this in a project, can add as a pr

[Vi-dot]

Yes please :) Could you do that ? Or push it on your fork

[VadimDez]

@mmaclach, sure, that would be great!

[mmaclach]

hey guys, i've added a pr with a solution - I'm not certain it will work for every case

[Vi-dot]

Hello !
Thanks for your help mmaclach.
But there is a bug. Selected text doesn't fit well the rendered layer.
screenshot

Can we use the text inside the rendered layer ?
In this demo of pdf.js, you can select text.

[Vi-dot]

I succeed using pdf_viewer part of pdfjs.
Here is a screenshot
I'm going to clean my fork and make a pull request.

Using this pdf_viewer part is going to help for others issues (like hyperlinks, dynamic zoom..).
We also have to make our fork of @types/pdf.

[mmaclach]

hey @Vi-dot - I am using a slightly different configuration in my project so the styling may be slightly off. I think @VadimDez is fixing it in master

[Vi-dot]

Ok mmaclach,
I guess you took time to achieve that,
But, do you don't think that ? > it's better to use what it's already in pdfjs

It's also better for element accessing in debug mode, because I don't have canvas any more.

[mmaclach]

Maybe you're misunderstanding me, this is from pdfjs, using the textContent() from the page and creating svg:text objects. If you wanted to you could create html instead. However I think for some pdf documents the text content may not exist

[Vi-dot]

Hello,
@mmaclach I understood clearly your way. But it's still not perfect, in the example, selection fits not well text.
In fact, from pdfjs you only get raw text. Integration and style are not from pdfjs.

@VadimDez Using PDFPageView solves this and may solve other issues (dynamic update viewport - usefull for big pdf, hyperlinks)
I made a try on this branch. If you like I can make a pull request.

[Vi-dot]

@mmaclach @VadimDez
I put a demo online to show you : https://vi-dot.github.io/ng2-pdf-viewer/

[VadimDez]

@Vi-dot Looks great! Is there any way to get it work with fake worker? Would simplify integration.
Thanks a lot, make a PR, so that i can merge it.

[Vi-dot]

What do you mean by fake worker ?
You may talk about this
PDFJS.workerSrc = 'lib/pdfjs-dist/build/pdf.worker.js';
If it's not defined, it can't work, I tried.

But the PDFPageView way may be not perfect. Now I'm trying to have a dynamic zoom (without reloading pdf), it works, but textLayer disapear with this method.
I opened an issue on pdfjs, PDFJS.PDFViewer may be better. I didn't try yet.

[mmaclach]

looks good, I wasn't aware of PDFPageView

[VadimDez]

@Vi-dot right now it's working with fake worker. I think with PDFJS.disableWorker = true you can enable fake worker, otherwise you have to specify worker, like you did, by providing path for pdf.worker.js.