Learn how to use Dash Bio for next-gen sequencing & quality control. 🧬 Register for the Oct 27 webinar.

How to display only part of a variable in hovertemplate / texttemplate text?

Hi! I know that I can use the %{variable} format with the hovertemplate and texttemplate attributes to display additional per-point information in a graph. However, since there seems to be only a limited number of attribute names that can be called in this way (the ones that are arrayOk: TRUE), I was hoping that I could store multiple variables as a string and then split the input somehow based on a separator character, thus allowing me to exceed the number of variables I can define and call upon.

For example, assume every data point has a text string formatted like:

text = ["Topeka_Kansas_USA_Earth_MilkyWay"]

Is there a way to call specific portions of this string with the %{variable} format with a hovertemplate/texttemplate statement?

If it were just a Python string, it might look something like:

location_text = [
    "Topeka_Kansas_USA_Earth_MilkyWay",
    "Montreal_Quebec_Canada_Earth_MilkyWay"
]

go.Figure(
    go.Sunburst(
        text = location_text,
        hovertemplate= f"City: {text.str.split('_')[0]} Country: {text.str.split('_')[2]}"
    )
)

I just don’t know how/if I can do this using d3 or javascript or whatever Plotly is using to parse the variables that are input.

Here’s the only relevant documentation on this I’ve found so far: link1, link2

I figured out a solution on my own.

In my question’s example above, if I replace location_text with a list of lists of strings (instead of just a list of strings with _ separators) then I can just call the desired string directly by its index. Example:

location_text = [
    ["Topeka", "Kansas", "USA", "Earth", "MilkyWay"],
    ["Montreal", "Quebec", "Canada", "Earth", "MilkyWay"]
]

go.Figure(
    go.Sunburst(
        text = location_text,
        hovertemplate= f"City: {text[0]} Country: {text[2]}"
    )
)
2 Likes