I cannot figure out how to transform a dash_table.DataTable server-side call back in a client-side callback in Plotly Dash using javascript.
Below an example:
def function1(data):
df = pd.DataFrame(data)
.....
return df
app = Dash(__name__)
app.layout = dbc.Container([
dcc.Interval('live-update', interval=50000, n_intervals=0),
dcc.Store(id='stored_data'),
dcc.Store(id='stored_data1'),
html.Div(id='t1')])
@app.callback(
Output('stored_data', 'data'),
Input('live-update', 'n_intervals'))
def stored_data(n):
return pd.read_csv('Test.csv').to_dict('records')
@app.callback(
Output('stored_data1', 'data'),
Input('stored_data', 'data'))
def table_1(data):
df = function1(data)
df = dash_table.DataTable(
data=df.to_dict('records'),
columns=[{'id': i, 'name': i,
'type': 'numeric'} for i in df.columns])
return df
app.clientside_callback(
"""
function(data) {
return {
data[type=table]
}
}
""",
Output('t1', 'children'),
Input('stored_data1', 'data'),
)
With a server-side callback I would Output directly the t1 within the second callback however I don't understand how to use the clientside_callback, all examples I found are using a chart not a table.