Добавьте Javascript вызовов к текстовому слою (div) поверх pdf. js viewer (canvas) - PullRequest
Новая
       55

Добавьте Javascript вызовов к текстовому слою (div) поверх pdf. js viewer (canvas)

0 голосов
/ 24 марта 2020

Я хочу наложить интерактивность на текстовые элементы PDF-файла, представленного как pdf.js.

. Подход, который я думаю, заключается в добавлении Javascript вызовов к <spans> отображается в текстовом слое <div>, который pdf.js добавляет поверх <canvas> для включения выделения и выделения текста.

Я начинаю с шаблона gh-pages.zip, добавляя код в app. js Метод PDFViewerApplication.run () примерно так: 

run(config) {
  this.initialize(config).then(function() {
    webViewerInitialized();
    console.log(PDFViewerApplication);
    PDFViewerApplication.pdfDocument.getPage(1);
    PDFViewerApplication.pdfViewer.viewer.children[1].outerHTML =
      '...<span  style="left: 72px; top: 98.5212px; font-size: 11.9552px; font-family: sans-serif; transform: scaleX(0.895184);"  onclick="console.log(\'Hence, recording and compiling a trace\')">Hence, recording and compiling a trace</span>...';
  });
},

pdfDocument равен null, поэтому строка getPage возвращает:

Uncaught (в обещании) TypeError: Невозможно прочитать свойство 'getPage' с нулевым значением в eval (приложение. js: 481)

children[1] равно undefined, включая, если Я прокручиваю на нужную страницу, а затем refre sh (pdf. js автоматически прокручивается в то же место, которое отображалось в последний раз).

Я предполагаю, что pdfDocument и children могут быть заполнены асинхронно, но я не знаю, как ждать, и я предполагаю, что есть лучший способ редактировать текстовый слой <spans>?

...