javascript - How to alter the text shown by pdf.js? -


i'm not trying modify pdf, i'm trying change displayed text

pdf.js outputs text reads in bunch of divs .textlayer > div, draws canvas

i read here viewing , editing pdf in browser impossible, but...

since pdf.js have api, idea "hook" pdf.js , change displayed text (that's more enough in case)

the closest find function named gettextcontent(), there no callback registered afaics.

is possible (without messing pdf.js itself)? if so, how?


edit (3)

this code print pdf text console, how proceed there mystery me.

'use strict';    // in production, bundled pdf.js shall used instead of systemjs.  promise.all([system.import('pdfjs/display/api'),  system.import('pdfjs/display/global'),  system.import('pdfjs/display/network'),  system.resolve('pdfjs/worker_loader')])      .then(function (modules)      {          var api = modules[0], global = modules[1];            // in production, change point built `pdf.worker.js` file.          global.pdfjs.workersrc = modules[3];            // fetch pdf document url using promises          let loadingtask        = api.getdocument('cv.pdf');            loadingtask.onprogress = function (progressdata) {              document.getelementbyid('progress').innertext = (progressdata.loaded / progressdata.total);          };            loadingtask.then(function (pdf)          {              // fetch page.              pdf.getpage(1).then(function (page)              {                  var scale     = 1.5;                  var viewport  = page.getviewport(scale);                    // prepare canvas using pdf page dimensions.                  var canvas    = document.getelementbyid('pdf-canvas');                  var context   = canvas.getcontext('2d');                  canvas.height = viewport.height;                  canvas.width  = viewport.width;                    // (debug) pdf text content                  page.gettextcontent().then(function (textcontent)                  {                      console.log(textcontent);                  });                    // render pdf page canvas context.                  var rendercontext =                  {                      canvascontext: context,                      viewport     : viewport                  };                  page.render(rendercontext);              });          });      });


edit (2)

the code example i'm trying mess viewer.js. granted it's not easiest example, it's simplest 1 find implements text in dom


edit (1)

i did try manipulate dom (specifically .textlayer > div mentioned earlier), pdf.js uses both divs , canvas magic, it's not text, result text div shown on top of canvas (or other way around), see:

http://imgur.com/a/2hozz

the reason first edit effect because pdfjs uses hidden div elements enable text selection. in order prevent pdfjs rendering text on canvas without modifying script can add following code:

canvasrenderingcontext2d.prototype.stroketext = function () { }; canvasrenderingcontext2d.prototype.filltext = function () { }; 

also if want avoid text manipulation in html elements can render them same method print console. here working jsfiddle changes hello, world! burp! :)

the jsfiddle created following resources:


Comments

Popular posts from this blog

android - InAppBilling registering BroadcastReceiver in AndroidManifest -

python Tkinter Capturing keyboard events save as one single string -

sql server - Why does Linq-to-SQL add unnecessary COUNT()? -