Render HTML vs Canvas - Githubissues

oyeanuj commented 7 years ago

Hi @VicStor, thanks for showcasing this! I'm wondering if you have any plans to have the PDF render as HTML (to allow for text selection, etc) rather than as canvas images?

VicStor commented 7 years ago

Hi @oyeanuj. It's so great if it's useful to you, I'd like to code generic react-pdf-viewer, but there are urgent affairs. (as always) PDFJS provides the ability to render pdf page as svg.


 componentWillMount() {
  pdfDocument.getPage(pageNumber)
  .then(pdfPage => { setState({ pdfPage }) })
}
// ...
// Later
renderPage() {
  const {pdfPage} = this.state;
  let pageViewport = pdfPage.getViewport(1);
// configure pageContainer with pageViewport

  pdfPage.getOperatorList())
  .then(opList => {
    const svgGfx = new window.PDFJS.SVGGraphics(pdfPage.commonObjs, pdfPage.objs);
    return svgGfx.getSVG(opList, pageViewport);
  })
  .then(svg => { pageContainer.appendChild(svg) });
}

There is another method to render textLayer on top of canvas, but i didn't try it. Don't be hesitate to ask if you'll need any help.

oyeanuj commented 7 years ago

@VicStor Thank you for that information! I'll study this a little bit more. Its clearly more complicated than I thought (atleast for my usecase), but I'll report back if I have any updates or findings!

As for the other method, were you referring to this - https://github.com/mozilla/pdf.js/issues/7072 ?

VicStor / react-pdf-viewer

Render HTML vs Canvas #2