Coder Social home page Coder Social logo

Make text selectable ? about ng2-pdf-viewer HOT 17 CLOSED

Vi-dot avatar Vi-dot commented on May 28, 2024
Make text selectable ?

from ng2-pdf-viewer.

Comments (17)

Vi-dot avatar Vi-dot commented on May 28, 2024 1

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.

from ng2-pdf-viewer.

VadimDez avatar VadimDez commented on May 28, 2024 1

@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.

from ng2-pdf-viewer.

VadimDez avatar VadimDez commented on May 28, 2024

Similar to #18

from ng2-pdf-viewer.

mmaclach avatar mmaclach commented on May 28, 2024

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

from ng2-pdf-viewer.

Vi-dot avatar Vi-dot commented on May 28, 2024

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

from ng2-pdf-viewer.

VadimDez avatar VadimDez commented on May 28, 2024

@mmaclach, sure, that would be great!

from ng2-pdf-viewer.

mmaclach avatar mmaclach commented on May 28, 2024

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

from ng2-pdf-viewer.

Vi-dot avatar Vi-dot commented on May 28, 2024

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.

from ng2-pdf-viewer.

Vi-dot avatar Vi-dot commented on May 28, 2024

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.

from ng2-pdf-viewer.

mmaclach avatar mmaclach commented on May 28, 2024

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

from ng2-pdf-viewer.

Vi-dot avatar Vi-dot commented on May 28, 2024

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.

from ng2-pdf-viewer.

mmaclach avatar mmaclach commented on May 28, 2024

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

from ng2-pdf-viewer.

Vi-dot avatar Vi-dot commented on May 28, 2024

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.

from ng2-pdf-viewer.

Vi-dot avatar Vi-dot commented on May 28, 2024

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

from ng2-pdf-viewer.

VadimDez avatar VadimDez commented on May 28, 2024

@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.

from ng2-pdf-viewer.

mmaclach avatar mmaclach commented on May 28, 2024

looks good, I wasn't aware of PDFPageView

from ng2-pdf-viewer.

dean9812 avatar dean9812 commented on May 28, 2024
  • How to select and copy a text after converted into canvas?. Already tried this '[render-text]="true"'
  • How to avoid right side and bottom gets trim?

Help me out of this. Thanks in advance. @VadimDez @mmaclach @Vi-dot

from ng2-pdf-viewer.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.