✊🏿 Black Lives Matter. Please consider donating to Black Girls Code today.
🐇 Announcing Dash VTK for 3d simulation graphics. Check out the March webinar.

How to use multiple restyleData events in a callback on legend clicks

I have a scatter plot with a legend that allows you to toggle traces on/off. I’m trying to implement a callback that updates a DashTable based on the traces/items that are toggled on in the scatter plot. I essentially want to highlight or style the corresponding rows in a table based on the items that are toggled in the plot.

Based on my understanding, using the restyleData properties in dcc.Graph is the way to go as it is supposed to give you the latest restyle event such as:

restyleData ( list ; optional): Data from latest restyle event which occurs when the user toggles a legend item, changes parcoords selections, or other trace-level edits. Has the form [edits, indices] , where edits is an object {<attr string>: <value>} describing the changes made, and indices is an array of trace indices that were edited. Read-only.

However, the problem is that each time the callback is triggered, it only returns the most latest toggled event although the documentation seems to suggest that the property could return multiple indices for all the traces that were edited. Is there any workaround or way to capture / retain all items that are toggled on vs toggled off at a given time to use in a callback?

Here’s a sample snippet of the code I currently have that only updates the most recently toggled item:

@app.callback(Output('topic-table', 'style_data_conditional'),
              [Input('bubble-plot', 'restyleData')])
def update_topics_highlighted(toggled_topics):
    if toggled_topics[0]['visible'] == [True]:

        temp_topic_num = str(toggled_topics[1][0])
        style_data_conditional = [{
            'if': {'filter_query': '{Topic#} = ' + temp_topic_num},
            'backgroundColor': 'red'
    else:  # item is toggled off: toggled_topics[0]['visible'] == ['legendonly']:
        style_data_conditional = [{}]               # toggle off , remove highlighting

    return style_data_conditional

UPDATE: I was thinking to having a separate global dictionary to keep track of the whether he the traces are turned off and on (only about 10) and using those values to with style_data_conditional every time there is a callback for a legend click

Though if anyone knows if there’s a way to do this directly with the dash table properties, I would appreciate the feedback.