Multiline tooltip on 8.1.10+

Ignition
1

Is there a way to make a tooltip have multiline text?

Here is what I tried:

  • first line \n second line
  • first line \r\n second line
  • first line\r\nsecond line

A hacky work-around is to set the width of the tooltip so it forces the text to wrap, but this solution is not ideal, as you can tell.

2

You can add a white-space: pre directive to the tooltip style:

5 Likes
3

Adding some detail here in case it is useful to others (verified on Ignition 8.1.18).

  1. If you want the text to automatically wrap when the length exceeds the max width of the tooltip and on line breaks then consider setting the white-space directive for the tooltip style to white-space: pre-wrap
    Reference: https://www.w3schools.com/cssref/pr_text_white-space.asp

  2. If you want to add line-breaks or other whitespace in a expression then escape sequences like ‘\n’ (for newline) and ‘\t’ (for tab) appear to work.
    Example:
    image
    image

4 Likes