Get trace name from hoverdata

I’m working on moving hover data from being displayed over a graph to being displayed in a table below. I notice that while the default behavior displays trace names on hover, hoverData doesn’t contain the trace name, just an index for "curveNumber.

I’m trying to either find a way to access the trace name through hoverData directly or to find it knowing the index.

For example, in the first example on interactive graphing, hovering over the dots shows “Trace 1, 4, a”. The same point’s data that is populated to 'hover-data' with just "curveNumber":0.

How can I find 'Trace 1' based on "curveNumber"? (or directly access the trace name)

1 Like

curveNumber is the index of the object/dict/“trace” inside figure.data. The names are set with the name property, i.e.

app.layout = html.Div([
    dcc.Graph(id='graph', figure={
        'data': [
            {'x': [1], 'y': [3], 'name': 'This is Trace 1'},
            {'x': [1], 'y': [3], 'name': 'This is Trace 2'}
        ]})
])

One way to access it would be to index the element directly inside the callback:

@app.callback(...)
def respond_to_hover_data(hoverData):
     curve_number = hoverData[...]
     trace_name = app.layout['graph'].figure['data'][curve_number]['name']
3 Likes

Thanks much. That’s exactly what I needed.

@chriddyp But, how do I get the trace names, if I update my plot using a callback after applying few filters? Because, the layout doesn’t update after the callback. Any idea how can I achieve this in such a case?

Thank you in advance!

1 Like

A bit late but did you have any answer for this ? I’m facing the same issue.
Thanks !

Wonderful! Thank you.