Hover Tool plotting - display wrapped lines of text if tooltip on left hand side of cursor

Hello,
When I use the Hover Tooltip to display long strings of data, the tool tip wraps long lines of text if the glyph appears on the right hand side of the pointer, but does not wrap the long lines of text if the glyph appears on the left hand side of the pointer. See the attached images. This means that the useful text disappears off the left hand side of the image. I have increased the border width around the plot to try to view all tooltip data, but even this is not enough to see the full text string.

How can I specify text wrapping in all cases for long strings of text using the Hover tool? Can you suggest a solution or a workaround, please?

Best wishes,

Fiona

I just discovered the Hover Tool “special variables.” One of the options is {safe}. From the source code: “including Safe after a field name will override automatic escaping of the tooltip data source.
Any HTML tags in the data tags will be rendered as HTML in the resulting HoverTool output.”

Basically what this means is that if you include {safe} after your data reference e.g. @z{safe} then any HTML tags in the text of z will be recognized. This way you can create breaks in your data and control it’s formatting. For my project I created a loop that added a new line every eight words.

For example:

if z = hello world

@z will display the entire text including and will not be bold

@z{safe} will display the text “hello world” in bold

You can see more about available formatters here, although I had to google the information about “safe” and play around with the tooltip HTML code:

···

On Monday, January 22, 2018 at 5:48:44 AM UTC-8, Fiona Marshall wrote:

Hello,
When I use the Hover Tooltip to display long strings of data, the tool tip wraps long lines of text if the glyph appears on the right hand side of the pointer, but does not wrap the long lines of text if the glyph appears on the left hand side of the pointer. See the attached images. This means that the useful text disappears off the left hand side of the image. I have increased the border width around the plot to try to view all tooltip data, but even this is not enough to see the full text string.

How can I specify text wrapping in all cases for long strings of text using the Hover tool? Can you suggest a solution or a workaround, please?

Best wishes,

Fiona

Dear Samuel,
Many thanks for your advice - much appreciated! I have now included the HTML line break tag ‘
’ within the text and used the {safe} mode which now allows me to format the text strings so they are readable.

Best wishes,

Fiona

···

On Tuesday, January 23, 2018 at 3:07:55 AM UTC, Samuel Miller wrote:

I just discovered the Hover Tool “special variables.” One of the options is {safe}. From the source code: “including Safe after a field name will override automatic escaping of the tooltip data source.
Any HTML tags in the data tags will be rendered as HTML in the resulting HoverTool output.”

Basically what this means is that if you include {safe} after your data reference e.g. @z{safe} then any HTML tags in the text of z will be recognized. This way you can create breaks in your data and control it’s formatting. For my project I created a loop that added a new line every eight words.

For example:

if z = hello world

@z will display the entire text including and will not be bold

@z{safe} will display the text “hello world” in bold

You can see more about available formatters here, although I had to google the information about “safe” and play around with the tooltip HTML code:

http://bokeh.pydata.org/en/latest/docs/reference/models/formatters.html#bokeh.models.formatters.NumeralTickFormatter

http://numbrojs.com/format.html

On Monday, January 22, 2018 at 5:48:44 AM UTC-8, Fiona Marshall wrote:

Hello,
When I use the Hover Tooltip to display long strings of data, the tool tip wraps long lines of text if the glyph appears on the right hand side of the pointer, but does not wrap the long lines of text if the glyph appears on the left hand side of the pointer. See the attached images. This means that the useful text disappears off the left hand side of the image. I have increased the border width around the plot to try to view all tooltip data, but even this is not enough to see the full text string.

How can I specify text wrapping in all cases for long strings of text using the Hover tool? Can you suggest a solution or a workaround, please?

Best wishes,

Fiona