Plotly: Trace Name Appears Outside of HoverInfo

Question:

Below is an example of some code where name appears on the outside of the hoverinfo label.

In my actual code I’ve already accounted for the name inside of the hoverinfo so I just want to make this bit disappear (see highlighted section in picture below).

Unfortunately I can’t set name ="" because I’m using the name value to change the colour of the markers.

Is anyone able to help with this please or has had any experience with trying to do this before? Any help would be massively appreciated.

It’s strange because this is shown to happen on the plotly dash official documentation on this page.

category = "a"

from plotly.subplots import make_subplots

fig_ex = make_subplots(rows=1, cols=2)

fig_ex.add_scatter(y=[4, 2, 3.5], mode="markers",
                marker=dict(size=20, color="MediumPurple"),
                name="a", row=1, col=1)

fig_ex.add_bar(y=[2, 1, 3],
            marker=dict(color="MediumPurple"),
            name="b", row=1, col=1)

fig_ex.add_scatter(y=[2, 3.5, 4], mode="markers",
                marker=dict(size=20, color="MediumPurple"),
                name="c", row=1, col=2)

fig_ex.add_bar(y=[1, 3, 2],
            marker=dict(color="MediumPurple"),
            name="d", row=1, col=2)

fig_ex.update_layout(showlegend = False)

fig_ex.update_traces(hovertemplate = 
                    "x: %{x}<br>" +
                    "y: %{y}")

fig_ex.for_each_trace(
    lambda trace: trace.update(marker_color="LightSeaGreen") if trace.name == category else (),
)

fig_ex.show()

enter image description here

Asked By: FluffySheep1990

||

Answers:

Try adding <extra></extra> at the end of the hovertemplate definition. As explained in the Plotly documentation this should remove the trace name.

fig_ex.update_traces(hovertemplate = "x: %{x} <br> y: %{y} <extra></extra>")
Answered By: Flavia Giammarino

You can also pass hoverlabel = {'namelength': -1}, as described here and as hinted at for JavaScript here.

Answered By: Sarah Messer
Categories: questions Tags: ,
Answers are sorted by their score. The answer accepted by the question owner as the best is marked with
at the top-right corner.