Set RichTextCss in TextHighlightAnnotation

Hello,

I’m trying to set rich text in my TextHighlightAnnotation but it throws error.
The code is as follow:

const highlightAnnotation = new Annotations.TextHighlightAnnotation()
highlightAnnotation.Id = annotationId
highlightAnnotation.PageNumber = toNumber(pageNum)
highlightAnnotation.Quads = JSON.parse(quads)

highlightAnnotation.setContents(text)

highlightAnnotation.setRichTextStyle({
0: {
‘font-style’: ‘italic’,
‘font-weight’: ‘bold’,
‘text-decoration’: ‘word’
}
})

The styling is not applied at all.

Please advise

Hi,

Thank you for contacting us regarding WebViewer! The “setRichTextStyle” API currently is only available for “FreeTextAnnotation”
https://www.pdftron.com/api/web/Annotations.FreeTextAnnotation.html#setRichTextStyle__anchor

I also don’t think highlight annotations support rich text in the XFDF spec. If you want to do something like bold highlighted text, you’ll need to make some sort of custom annotations
https://www.pdftron.com/documentation/web/guides/annotation/custom-annotations/

Or just creating free text annotation that overlap the text.

Please let me know if the above was helpful or if you have any other questions

Best Regards,
Andrew Yip
Software Developer
PDFTron Systems, Inc.

Hello Andrew,

Thanks for the reply. In the document, setRichTextStyle is listed under TextHighlightAnnotation. Should it be there?
Is there a way to convert quads to rect? I currently have the quads for TextHighlightAnnotation, how can I convert that to FreeTextAnnotation?

Thanks

Hi,

We will update our documentation so that “setRichTextStyle” isn’t under “TextHighlightAnnotation” since that seem to be a mistake.

For converting “quads” to “rect”, quads are made up of the 4 corners of a rectangle. You can find out more about them below
https://www.pdftron.com/documentation/web/guides/extraction/text-position/

While “Rect” is only expecting two of the points
PDFTron WebViewer Class: Rect

So you can convert “quad” to “rect” by doing something like
const rect = new Annotations.Rect(quad.x1, quad.y1, quad.x3, quad.y3);

Please let me know if you have any other questions

Best Regards,
Andrew Yip
Software Developer
PDFTron Systems, Inc.