Can hovertemplate combine information from multiple traces?

If I pass a hovertemplate argument to go.Figure(go.Heatmap), and then add another trace to the figure, the hovertemplate designed for the first data trace gets filled in with data from the most recent data (second) trace. Ideally I would like to create a single hovertemplate that combines data from different traces – something like this maybe:

go.Figure(
    data = [
        go.Heatmap(
            z = dataSlice0,
        ),
        go.Heatmap(
            z = dataSlice1,
            opacity = 0.7,
        ),
    ],
    layout = {
        'hovertemplate': "z0: %{data[0].z}<br>z1: %{data[1].z}",
    },
)

Thanks!

Hi @tks, the hovertemplate is associated to a trace so it’s not possible to have it in the layout. However, you can use the customdata argument as in the code below:

import plotly.graph_objects as go
import numpy as np
fig = go.Figure()
img1 = np.random.random((5, 5))
img2 = np.random.random((5, 5))
fig.add_trace(go.Heatmap(z=img1, coloraxis="coloraxis1"))
fig.add_trace(go.Heatmap(z=img2, customdata=img1, opacity=0.5, 
                         hovertemplate='z:%{z:.3f}, zother:%{customdata:.3f}',
                         coloraxis="coloraxis1", name=''))
fig.show()

Thanks @Emmanuellecustomdata works well for the example I gave. However, since customdata only accepts a single array (tuple, list, np.array, etc.) and not a list of arrays, I don’t think this solution will work when dealing with more than two traces. I should have included three or more heatmaps in my (lazy) example!

Ha ha yes it’s always better to give an example as close as possible to what you want to do!

Here is working example, you just need to give the right dimension to customdata (customdata[0] etc. corresponds to the last dimension of the array so I used np.dstack here).

import plotly.graph_objects as go
import numpy as np
fig = go.Figure()
img1 = np.random.random((5, 5))
img2 = np.random.random((5, 5))
img3 = np.random.random((5, 5))
customdata = np.dstack((img1, img2))
fig.add_trace(go.Heatmap(z=img1, coloraxis="coloraxis1"))
fig.add_trace(go.Heatmap(z=img2, opacity=0.5, coloraxis="coloraxis1"))
fig.add_trace(go.Heatmap(
    z=img3, customdata=customdata, opacity=0.5, 
    hovertemplate='z:%{z:.3f} <br> zother:%{customdata[0]:.3f} <br> zter: %{customdata[1]:.3f} ',
    coloraxis="coloraxis1", name=''))
fig.show()