HI BRO. thanks! Do you know how I can add the text_layer to get a selectable text for each page. I've tried with different versions but I get the error TextLayerBuilder is not defined. Thanks bro, again
@@TheWheelchairGuy I’m working with the pdf.js library, the same you are using, with html css and JavaScript. Even I used your code to show the pdf. Also, I have tried with jquery but I got an error with a class called something like textLayersbuillder. The idea is to insert the code into a Wordpress template. But I think if I have the viewer working on a common html page, I can add it to my Wordpress page.
After doing some research, I found that it is a bit complicated to make a pdf document selectable with PDF JS Library because they do not have a built-in text selector. It is a pain. If you find a solution, let me know @@HenryRiosD
@@TheWheelchairGuy whit the pdf.worker.js and the next code (instead your line 61) I was able to add the text y a new layer called textLayer. But I'm trying to match the text with the canva: page.render(renderContext).promise.then(() => { const textLayerDiv = document.createElement('div'); textLayerDiv.className = 'textLayer'; textLayerDiv.style.width = viewport.width + 'px'; textLayerDiv.style.height = viewport.height + 'px'; pageDiv.appendChild(textLayerDiv); page.getTextContent().then(textContent => { pdfjsLib.renderTextLayer({ textContent: textContent, container: textLayerDiv, viewport: viewport, textDivs: [], textContentItemsStr: textContent.items.map(item => item.str) }); }); }); this is the call to worker file: Also, add the css style:
Nice content bro, I understood everything you said, thank you.
Glad to hear that. Thank you
Thank you so much buddy! Can't believe you got it, I was looking for this all day long
Glad I could help! I hope that you like and subscribe to my channel
Happy new year , glad you are better !!
Happy new year! Thank you for your kind words
HI BRO. thanks! Do you know how I can add the text_layer to get a selectable text for each page. I've tried with different versions but I get the error TextLayerBuilder is not defined. Thanks bro, again
Which app are you using? I would like to give you a clear answer
@@TheWheelchairGuy I’m working with the pdf.js library, the same you are using, with html css and JavaScript. Even I used your code to show the pdf. Also, I have tried with jquery but I got an error with a class called something like textLayersbuillder. The idea is to insert the code into a Wordpress template. But I think if I have the viewer working on a common html page, I can add it to my Wordpress page.
After doing some research, I found that it is a bit complicated to make a pdf document selectable with PDF JS Library because they do not have a built-in text selector. It is a pain. If you find a solution, let me know @@HenryRiosD
@@TheWheelchairGuy whit the pdf.worker.js and the next code (instead your line 61) I was able to add the text y a new layer called textLayer. But I'm trying to match the text with the canva:
page.render(renderContext).promise.then(() => {
const textLayerDiv = document.createElement('div');
textLayerDiv.className = 'textLayer';
textLayerDiv.style.width = viewport.width + 'px';
textLayerDiv.style.height = viewport.height + 'px';
pageDiv.appendChild(textLayerDiv);
page.getTextContent().then(textContent => {
pdfjsLib.renderTextLayer({
textContent: textContent,
container: textLayerDiv,
viewport: viewport,
textDivs: [],
textContentItemsStr: textContent.items.map(item => item.str)
});
});
});
this is the call to worker file:
Also, add the css style:
@@TheWheelchairGuy I found the solution, but I guess UA-cam deleted my reply