search

TaTo30 / vue-pdf

PDF component for Vue 3
https://tato30.github.io/vue-pdf/
MIT License
424 stars 62 forks source link

How to highlight multiple lines of text #98

Closed vikramsoni2 closed 5 months ago

vikramsoni2 commented 7 months ago

If I want to highlight a paragraph of text, how do I do it? I see that the text-layer is generating spans of text for each lines. is there an easier way to pass a sentence in the highlight-text param so that it highlights the entire sentence ?

awesome work by the way!

vikramsoni2 commented 7 months ago

the highlighting of text is very unstable. if there is one italic or bold text in the line, that line does not highlight.

fredrikmikkelsen commented 6 months ago

I would like to second this. It would be a great addition if you could it make this possible.

Will it be made possible to add more than one highlighted sentence per page at some point?

Btw good job creating this package!

TaTo30 commented 6 months ago

I would like to know your use cases.

The highlight-text prop is more like a "search and highlight the results" similar to ctrl + f feature on browsers.

fredrikmikkelsen commented 6 months ago

I would like to use the current functionality but to highligt multiple sentences on a page.

Lets say I have a page where both of these sentences are included: Lorem ipsum dolorand Aenean bibendum faucibus. Right now it's only possible to highlight one of them. I would like to be able to highlight both of them.

vikramsoni2 commented 6 months ago

I would like to know your use cases.

The highlight-text prop is more like a "search and highlight the results" similar to ctrl + f feature on browsers.

I did some experiments, it works as long as the text layer does not have any decoration ( i.e. bold or any other styles). when you have a pdf which has any styles, it cannot select those elements. It can select multiple lines of text if the texts are just plain-text. but if there is any other decoration, I see that the text layer creates spans to adjust the style, and that's where the highlighting breaks.

The use-case: I have Chat-bot which answers the questions from the PDF, and also provide the chunk of the pdf which was used to answer the question. ( the chunk is just text, not formatted text(. and I want to highlight the chunk.

TaTo30 commented 6 months ago

I did some experiments, it works as long as the text layer does not have any decoration ( i.e. bold or any other styles). when you have a pdf which has any styles, it cannot select those elements. It can select multiple lines of text if the texts are just plain-text

Could you share the pdf of this issue? @vikramsoni2

vikramsoni2 commented 6 months ago

I did some experiments, it works as long as the text layer does not have any decoration ( i.e. bold or any other styles). when you have a pdf which has any styles, it cannot select those elements. It can select multiple lines of text if the texts are just plain-text

Could you share the pdf of this issue? @vikramsoni2

here you go. just created a small app for demo purpose. if you notice, I am trying to highlight the same paragraph in both pages. the first one includes a small decoration in the text which breaks the highlight. in the second page, I remove the last ward to not include that decorated text and it works.

https://stackblitz.com/edit/vitejs-vite-xcgtmn?file=src%2FApp.vue

chronicadventure commented 5 months ago

Any updates on this? this would be a great feature.