how to include trace name in hovertemplate?

Question

I am using cufflink to plot pandas dataframe using plotly. How to include trance name( column name) in hover template?

I use name=df.columns.to_list() then use %{name} in hovertemplate and it doesn't work. Thanks for help.

 fig=df.iplot(xTitle='Time',yTitle='Temperature(degC)',title=title,name=df.columns.to_list(),
                          size=10,width=4,asFigure=True)
    
    fig.update_traces(hovertemplate='Location: %{name}<br>'+'Date: %{x|%b %d %H:%M,%Y} ,<br>Value:%{y}')

df.head().to_dict()   

{499.95: {Timestamp('2021-10-30 21:08:00'): 224.09,
  Timestamp('2021-10-30 21:17:00'): 224.78,
  Timestamp('2021-10-30 21:27:00'): 223.12,
  Timestamp('2021-10-30 21:36:00'): 224.3,
  Timestamp('2021-10-30 21:45:00'): 225.06},
 627.62: {Timestamp('2021-10-30 21:08:00'): 229.74,
  Timestamp('2021-10-30 21:17:00'): 230.66,
  Timestamp('2021-10-30 21:27:00'): 228.76,
  Timestamp('2021-10-30 21:36:00'): 230.0,
  Timestamp('2021-10-30 21:45:00'): 230.32},
 755.29: {Timestamp('2021-10-30 21:08:00'): 230.42,
  Timestamp('2021-10-30 21:17:00'): 231.13,
  Timestamp('2021-10-30 21:27:00'): 229.0,
  Timestamp('2021-10-30 21:36:00'): 230.28,
  Timestamp('2021-10-30 21:45:00'): 231.21},
 882.96: {Timestamp('2021-10-30 21:08:00'): 188.76,
  Timestamp('2021-10-30 21:17:00'): 190.16,
  Timestamp('2021-10-30 21:27:00'): 189.01,
  Timestamp('2021-10-30 21:36:00'): 191.25,
  Timestamp('2021-10-30 21:45:00'): 191.52},
 1010.63: {Timestamp('2021-10-30 21:08:00'): 196.5,
  Timestamp('2021-10-30 21:17:00'): 197.54,
  Timestamp('2021-10-30 21:27:00'): 196.08,
  Timestamp('2021-10-30 21:36:00'): 198.45,
  Timestamp('2021-10-30 21:45:00'): 198.66},
 1138.3: {Timestamp('2021-10-30 21:08:00'): 206.63,
  Timestamp('2021-10-30 21:17:00'): 206.79,
  Timestamp('2021-10-30 21:27:00'): 205.9,
  Timestamp('2021-10-30 21:36:00'): 207.4,
  Timestamp('2021-10-30 21:45:00'): 208.54},
 1265.97: {Timestamp('2021-10-30 21:08:00'): 213.16,
  Timestamp('2021-10-30 21:17:00'): 214.1,
  Timestamp('2021-10-30 21:27:00'): 212.56,
  Timestamp('2021-10-30 21:36:00'): 214.97,
  Timestamp('2021-10-30 21:45:00'): 215.12},
 1393.64: {Timestamp('2021-10-30 21:08:00'): 202.74,
  Timestamp('2021-10-30 21:17:00'): 205.55,
  Timestamp('2021-10-30 21:27:00'): 203.71,
  Timestamp('2021-10-30 21:36:00'): 207.18,
  Timestamp('2021-10-30 21:45:00'): 203.78},
 1521.31: {Timestamp('2021-10-30 21:08:00'): 199.74,
  Timestamp('2021-10-30 21:17:00'): 200.83,
  Timestamp('2021-10-30 21:27:00'): 199.52,
  Timestamp('2021-10-30 21:36:00'): 201.96,
  Timestamp('2021-10-30 21:45:00'): 203.11},
 1648.98: {Timestamp('2021-10-30 21:08:00'): 127.69,
  Timestamp('2021-10-30 21:17:00'): 127.94,
  Timestamp('2021-10-30 21:27:00'): 127.1,
  Timestamp('2021-10-30 21:36:00'): 128.06,
  Timestamp('2021-10-30 21:45:00'): 128.75}}

Answer 1

In plotly, the hovertemplate only has access to the variables x and y values by default (and will therefore not understand what name is referring to). Normally you would use the customdata parameter when defining your figure and then use %{customdata} in your hovertemplate string as described in the documentation here.

However, since you are using df.iplot(...) to create your figure, and it appears you cannot use pass customdata as an argument, we'll need to go into the figure object and manually define the customdata for each trace, and then we can use %{customdata} in the hovertemplate string to display the column name.

For example:

fig=df.iplot(xTitle='Time',yTitle='Temperature(degC)',title="title", name=df.columns.tolist(),
                          size=10,width=4,asFigure=True)

## manually set customdata in each trace
for fig_scatter_data in fig.data:
    fig_scatter_data['customdata'] = [fig_scatter_data['name']] * len(fig_scatter_data['x'])

fig.update_traces(hovertemplate='Location: %{customdata}<br>'+'Date: %{x|%b %d %H:%M,%Y} ,<br>Value: %{y}')

This produces the following figure: