Generating the text layer - question regarding the textLayer parameter.

[Rick Lashes]

The api docs says the following for the render method:

/* Begins the process of rendering a page to the desired context.
* @param {object} params A parameter object that supports:
* {
* canvasContext(required): A 2D context of a DOM Canvas object.,
* textLayer(optional): An object that has beginLayout, endLayout, and
* appendText functions.,
* continueCallback(optional): A function that will be called each time
* the rendering is paused. To continue
* rendering call the function that is the
* first argument to the callback.
* }.
* @return {Promise} A promise that is resolved when the page finishes
* rendering.
*/

Parameter object supports: 'textLayer'. So I'm to assume I can do my render command like so:

var renderContext = {
canvasContext: ctx,
textLayer: someObject,
viewport: viewport
};
page.render(renderContext);

what exacly is it expecting of "someObject", how do I add the beginLayout, endLayout and appendText fucntions to that object before passing it to the render method?

Thanks!

[Rick Lashes]

You know i'm noticing now that it doesn't say anything about a viewport option, so why does the sample code I'm using have a viewport option in the object? strange.

[konk...@gmail.com]

I'm also trying to figure this out. I've followed the Hello World example to get a PDF of my choosing embedded in my page.

What's the minimum it takes to make the text searchable and selectable? I've tried adapting TextLayerBuilder from http://jviereck.github.com/pdfListView/ but it's not working and I'm clearly missing some key concepts here.

I'd even be up for writing a how-to guide on the topic, since I love what PDF.js is doing so much - but I need help figuring out how to do it myself. :)

-- Eric

[Geoffrey Booth]

I'm just as interested as Eric. Any guidance would be most appreciated!

[Julian Viereck]

> What's the minimum it takes to make the text searchable and selectable? I've tried adapting TextLayerBuilder from http://jviereck.github.com/pdfListView/ but it's not working and I'm clearly missing some key concepts here.

Can you be a little bit more precise what's not working for you?

Basically, the textlayer object you use for the renderContext should have these three properties:

beginLayout: function() {
[...]
},

endLayout: function() {
[...]
},

appendText: function(geom) {
[...]
}

- Julian

[Rick Lashes]

Resurrecting my old post here...

To answer my original question, I had to build the text layer object using a built in function, then I could pass it to build out the text layer. Here is my final code

FYI: My context is that i have a single page loaded into the canvas at a time. I have external forward and back buttons. When a forward or back button is pressed the following function is fired:

function renderPage(num) {
// Using promise to fetch the page
pdfDoc.getPage(num).then(function(page) {

var viewport = page.getViewport(scale);
canvas.height = viewport.height;
canvas.width = viewport.width;


// Other code custom to my scenario was removed here

// prep text layer object
var textLayerDiv = null;
$('#textLayer').html(''); // clear text layer
if (!PDFJS.disableTextLayer) {
textLayerDiv = document.getElementById('textLayer');
textLayerDiv.className = 'textLayer';
document.getElementById('canvas-container').appendChild(textLayerDiv);
}


// Create the textlayer object using the builder
var textLayer =
textLayerDiv ? new TextLayerBuilder(textLayerDiv, this.id - 1) : null;

// Render PDF page into cancvas context
// USE the text layer object here

var renderContext = {
canvasContext: ctx,

textLayer: textLayer,
viewport: viewport
};
page.render(renderContext).then(function() {
working = false;
});



// Extract page text and load it to the text layer
page.getTextContent().then(
function textContentResolved(textContent) {
textLayer.setTextContent(textContent);
},
function pdfPageRenderError(error) {
console.log("PAGE RENDER ERROR: " + error);
}
);


});

}



On Thursday, January 31, 2013 3:11:18 PM UTC-6, Rick Lashes wrote:

[Yury Delendik]

FYI, you can find an example and how to use text layer object at
https://github.com/mozilla/pdf.js/pull/3347

> _______________________________________________
> dev-pdf-js mailing list
> dev-p...@lists.mozilla.org
> https://lists.mozilla.org/listinfo/dev-pdf-js