Black Lives Matter. Please consider donating to Black Girls Code today.

2 callback function sharing variables

I first discribe the simple functionality that I am being able to repdroduce to then explain the incremental step that I can’t figure out how to solve.

Working scenario

I have a function that I pass a pandas DataFrame and return another one with the values changes.
This DataFrame is displayed as a dcc.Graph with the figure being created with ff.create_table(DataFrame)
I have a dcc.Interval that is updating the values shown in the browser.

def draw_Table(Q):
    table = ff.create_table(Q, index=True)
    table.layout.height, table.layout.width=350, 350
    for i in range(len(table.layout.annotations)):
        table.layout.annotations[i].align = 'center'
    return table

def update_Q(Q):
    # code to modify Q
    return Q

app.layout = html.Div([
        html.H1(children='Frozen Lake: Q-Learning Demo'),
        dcc.Graph(id='table', figure=draw_Table(Q)),
        dcc.Interval(id='time', interval=1*1000, n_intervals=0),

# Timer for the Visualization Update
@app.callback(Output(component_id = 'table', component_property='figure'),
              [Input(component_id = 'time2', component_property='n_intervals')])    
def update_table(n):   
    new_table = draw_Table(update_Q(Q))
    return new_table

if __name__ == '__main__':

Non-working scenario
This works fine because I update the values every time the interval fires the update_table method. However, I would like to have a function which is updating the values of Q inside a while loop continuosly on the background. And only update the showing Table when the Interval fires the update_table.

So update_table will work better as update_visualization; while a function is performing operations continously on dataframe Q.

How can I do it? I have followed this thread with a hidden div to store the value that looks closse but I don’t know how to plug in my functionality in there:

Thanks in advance,