Tick labels broken when unifying hover across subplots

📊 Plotly Python
1

When I add a hover line across multiple subplots, it prevents me from displaying tick labels on each axis, like so:

image
image516×346 9.24 KB

I expect to be able to see tick labels on both sets of axes.

Minimal working example:

import plotly.graph_objects as go
from plotly import data
from plotly.subplots import make_subplots

df = data.stocks()

fig = make_subplots(rows=2, cols=1, shared_xaxes=True)

fig.add_trace(go.Scatter(x=df["date"], y=df["AAPL"], name="A"), row=1, col=1)
fig.add_trace(go.Scatter(x=df["date"], y=df["GOOG"], name="B"), row=2, col=1)

fig.update_layout(hovermode="x unified")  # allow hover (step 1)
fig.update_traces(xaxis="x1")  # allow hover (step 2)
fig.for_each_xaxis(lambda x: x.update(showticklabels=True))  # tick labels are broken

fig.show()

Attempts at resolving the issue by manually defining a grid in fig.update_layout (e.g.
this thread) does not work.

A workaround is to simply set fig.update_traces(xaxis="x2"), or whatever the last row is, but that is a poor solution for very long charts with many subplots, where it is impossible to see the tick labels of the bottom-most plot. It will also not work for subplots with multiple columns.

2

Hi! I was reading and hopping between threads and I guess this could work for what I see. It’s up to you figure out how to reduce the gap between subplots…
The answer, anyway, is in this thread, that I’ve supposed you have read already…
Hover question. how to info in all trace Thanks to @empet :bulb:

image
image823×721 35 KB

Code with grid instead make_subplots 
import plotly.graph_objects as go
import pandas as pd
from plotly import data

df = data.stocks()

fig=go.Figure([
    go.Scatter(x=df["date"], y=df["AAPL"], xaxis="x", yaxis="y", name="Apple"),
    go.Scatter(x=df["date"], y=df["GOOG"], xaxis="x", yaxis="y2", name="Google"),
])
fig.update_layout(height=550, #width=750,
                  showlegend=False,
                  hoversubplots="axis",
                  title="Stock Price Changes",
                  hovermode="x unified", #or "x unified" without dashed line
                  grid = dict(rows=2, columns=1, #the grid cells (row, col): [[(0,0), (0,1)], [(1,0), (1,1)]
                              subplots=[["xy"],#, ""],  #this grid attribute gives info on the position of each trace
                                        ["xy2"]],#, ""]],
                              xgap=0)
                 )
fig
1 Like
3

Sorry, perhaps I was not clear enough in the original post.

It is already possible set the tick labels on the bottom-most plot with the code above with fig.update_traces(xaxis="x2") as mentioned above, but I would like to see tick labels on both sets of axes, like this:

image
image528×341 10.1 KB

4

Again… thanks to @empet !!
Subplots with shared x-axes BUT show x-axis for each plot

5

Hi Juan,

Not sure if the code works on your machine, but using plotly 6.0.0, this is the result I get:

image
image744×474 30.6 KB

As you can see, the hover does not go across both plots!

I can force the hover to go across both charts using fig.update_traces(xaxis="x1") as I have described in my original post, but this voids the solution you linked. For clarity, here is my error again:

image
image753×546 31.9 KB

I believe this is because the trace names are explicitly defined as x1, which does not allow tick labels to be updated for all axes.
But, you can see using fig.layout that one should expect ticklabels for both axes:

Layout({
    'hovermode': 'x unified',
    'template': '...',
    'xaxis': {'anchor': 'y', 'domain': [0.0, 1.0], 'matches': 'x2', 'showticklabels': True},
    'xaxis2': {'anchor': 'y2', 'domain': [0.0, 1.0], 'showticklabels': True},
    'yaxis': {'anchor': 'x', 'domain': [0.575, 1.0]},
    'yaxis2': {'anchor': 'x2', 'domain': [0.0, 0.425]}
})

I’d would also point out that the solution you linked is equal to fig.for_each_xaxis(lambda x: x.update(showticklabels=True)) from my original post.