HTML entities in hover text

[harrelfe]

I am glad to see plotly 4.5.2 on CRAN, which I've installed. I am re-writing several functions to use the new argument structure - so far so good on that. I have a potential major problem though. I routinely put HTML markup inside hover text, including <span> <br> etc. and so far the hover text is showing the markup and not the formatted output as it did before the new version. Any help greatly appreciated.

[cpsievert]

Thanks for writing in Frank! So cool to know you're using plotly :)

I don't think the update should have broke HTML markup in hover text. Do you have an example?

These works as expected for me:

plot_ly(mtcars, x = ~wt, y = ~mpg, text = ~paste0(cyl, "<br>", disp))
plot_ly(mtcars, x = ~wt, y = ~mpg, text = ~paste0('<span style="color:black">', cyl, '</span>'))

[harrelfe]

Thanks for the quick reply. Those worked for me. This one did not:

x <- 1:5
y <- (1:5)^2
z <- c(rep('', 4),
       'this is <span style="font-size: 82%;"><sup>313</sup>&frasl;<sub>1024</sub></span> that')

plot_ly(x=~x, y=~y, hoverinfo='text', text=~z)

[cpsievert]

Ah, it looks like the ⁄ HTML entity is the issue here....plotly.js recently removed generalized HTML entity decoding, as apparently decoding those in <svg> can lead to XSS vulnerabilites.

For now, you'll have to use a literal /, but hopefully I can convince the plotly.js folks to add this to our official list of supported entities -- https://github.com/plotly/plotly.js/blob/master/src/constants/string_mappings.js

[harrelfe]

Thanks for figuring this out. Would hex character codes also fail? I use many more characters than listed in the table you linked to so I really hope this can be addressed. I would also like to include HTML

... in hover strings.

Also is there detailed documentation for add_lines, add_markers, add_polygons, etc?

Thanks

[cpsievert]

I think we fully support unicode, so you could use unicode in the meantime.

This is still in progress, but it will be the official reference for the add_*() functions -- https://cpsievert.github.io/plotly_book/the-plotly-cookbook.html

[harrelfe]

Thanks. I tried the following, which attempts to render, but it does not render correctly:

x <- 1:5
y <- (1:5)^2
z <- c(rep('', 4),
       'this is <span style="font-size: 82%;"><sup>313</sup>&#2044;<sub>1024</sub></span> that')
# frasl=hex 2044
plot_ly(x=~x, y=~y, hoverinfo='text', text=~z)

By the way I really like the change to using the R formula language for specifying variables to plotly, plus all the new add_ functions.

[timelyportfolio]

I could easily be way off on this, but If I copy the actual character ⁄ into the string, it seems to work as expected.

library(plotly)

x <- 1:5
y <- (1:5)^2
z <- c(rep('', 4),
       'this is <span style="font-size: 82%;"><sup>313</sup>⁄<sub>1024</sub></span> that')
# frasl=hex 2044
plot_ly(x=~x, y=~y, hoverinfo='text', text=~z)

To get this to work in htmltools without plotly or htmlwidgets, we can use the HTML() function, but note if we wrap the unicode with HTML, it does not work.

library(htmltools)
browsable(tags$div(HTML('⁄')))

[harrelfe]

Yes the ordinary literal slash works but I was trying to get the factional slash to work. Also trying this because there are several other HTML characters I want to use in hover text. I did verify that the hex code for ≤ works (<= symbol).

[timelyportfolio]

hard to tell but the slash in my example is the fractional slash and not the literal slash.

[LuShuYangMing]

How to add table on hover like this picture