Customizing text on x unified hovering

šŸ“Š Plotly Python
21

So it appears that the question of removing or amending the ā€œtitleā€ of a hover using unified hovermode has been asked multiple times without an answer on the plotly forum over the years:

And more than a few times on stackoverflow:

I am building a fairly complicated dashboard where this issue comes up in three separate places. I am inferring from the lack of a solution that this is just not currently possible. I am not super familiar with the plotly development process, but is there a way to request that this functionality be added?

22

I havenā€™t found anything in the documentation suggesting that the hovertemplate of a stacked x-unified bar chart canā€™t be customised in those ways, and something must be assembling it in that format, but what that may be doesnā€™t seem to be specified anywhere.

23

Completely undocumented, but while I was stepping through the plotly figure in dash I noticed that the default template takes the data passed in and create a hover template with <extra></extra> tagged onto the end of the hovertemplate. If you add <extra></extra> to the end of a traces hovertemplate it will not add the trace name into the ā€˜x unifiedā€™ hover allowing you to do the following:

 bar_graph_layout= "plotly express or plotly graph object"
 for x in bar_graph_layout.data:
    if x.name:
            x.hovertemplate = "{name}:<br>Sometag: %{x}<br>Some otherinfo: %{y}<extra></extra>".replace('{name}',x.name)

If <extra></extra> is not added the hovertemplate, the legend group or trace name will be applied around the hovertemplate in something you cannot edit, but if that html tag is in the hovertemplate it allows you the control the entire hover for each x unified group.

24

Not to necro an old thread, but I again ran into this problem and wanted to check in ( 6 months later) to see if anyone had any ideas. The above solution, of adding the ā€œextraā€ tags, involve modifications to the the ā€œtrace names,ā€ circled in red below, not the tooltip title, circled in blue below.

Untitled

Ideally, I would be able to replace the blue circled text, which is the y-axis tick name, with a combination of some static text and the value from another datapoint in the set. E.g., replace ā€œ6thā€ with ā€œTotal Tested: 87.ā€

I know this seems minor, but as I mention in an earlier message, this issue actually pops up three times in this particular project of mine and Iā€™d love to fix it if possible.

25

Also, if you use hoverinfo=ā€œtextā€ and hovertext=[array of texts], rather than hovertemplate, this will avoid showing the title

1 Like
26

Your suggestion was very helpful in my educational project. Thank you.

image
image1560Ɨ623 107 KB

hov_text= [f'šŸŒ€ Wind Speed <br><br>{d}<br>Daily average: {w} km/h'
           for d, w in zip(dff['date'].dt.strftime('%B %d,%Y'), dff['wind_daily_average'])]

fig = go.Figure()
fig.add_scatter(hovertext=hov_text, hoverinfo='text', ...