Can you add html to plot hovertext?

plotly.js
1

I’ve been trying to add html to the tooltips (either on hover or on click), but have been having trouble figuring out whether or not this is possible. It looks like some HTML statements work (like br), whereas others (like div and img) do not. Is something like this possible?

Thank you

2

plotly.js text only support subset of HTML in its text elements.

More info here: https://plot.ly/javascript/reference/#layout-annotations-text

Source code here: https://github.com/plotly/plotly.js/blob/master/src/lib/svg_text_utils.js#L214-L221

1 Like
3

Somewhat related question.

Is it possible to use a callback function to generate html “on the fly” for the text element of the hovered data item? So we don’t need to generate all the text elements in advance.

1 Like
4

Not at the moment, unfortunately.

5

Actually, is possible with a hack:
var text = [];
for(var i = 0; i < npoints; i++) {
var obj = {i:i};
obj.toString = function () {
// return string based on this.i
return generateTipText(this.i);
}
text.push(obj);
}