435 long text does not fit in dashboard explanation image

[laurasootes]

Instead of creating an html element, making a screenshot of that, loading the screenshot and plotting that, highlighted text is placed into div elements, stacked word by word next to each other. The output is not an image of a screenshot, but a highlighted text element.

This improves the resolution of the highlighted text output and it prevents long text inputs from being cut off, instead they now continue on the next line (and this adjusts if you change the width of your screen)

[cpranav93]

Everything looks great! Amazing work @laurasootes. Go ahead and merge.

I did have a question: I see that no matter what sentence I give, the highlighting of the words are always in red. Is that intentional? or is there supposed to be some green in there too?

[laurasootes]

Yes, I've noticed this previously too, for LIME text you do get the range from blue to red, but for RISE text not. This is simply because RISE returns only positive values for the relevances, while LIME returns positive and negative numbers. For text, the highlighting is based on

def _highlight_word(word, importance, max_importance, max_opacity):

"""Defines how to highlight words according to importance."""

opacity = max_opacity * abs(importance) / max_importance
if importance > 0:
    color = f'rgba(255, 0, 0, {opacity:.2f})'
else:
    color = f'rgba(0, 0, 255, {opacity:2f})'
highlighted_word = f'<span style="background:{color}">{word}</span>'
return highlighted_word`

i.e. positive relevances will always be a shade of red.

This is the same in the DIANNA build-in visualisation:
https://github.com/dianna-ai/dianna/blob/main/tutorials/rise_text.ipynb

On the other hand, for images a blue-to-red heatmap is applied to the returned relances-> the blue-to-red heat map is then based on the range of the given relevances of the image