I'm struggling to get 2 traces on a plotly graph when updating the data from a javascript clientside callback.
I have this clientside callback:
app.clientside_callback(
ClientsideFunction(
namespace='clientside',
function_name='update_rms_graph'
),
Output('rmstrace-graph', 'extendData'),
(
Input('client-rms-data', 'data'),
Input('client-rms-2-data', 'data'),
Input('timer-refresh-rms-fft', 'n_intervals')
)
)
Which is defined as such:
window.dash_clientside = Object.assign({}, window.dash_clientside, {
clientside: {
update_rms_graph: function(data, data_rms, n_intervals) {
console.log(data.rms.length, data_rms.rms.length);
return [
{y: [data.rms], x: [data.t]},
//{y: [data_rms.rms], x: [data_rms.t]}, // This is where i'd like to add my new trace
[0],
data.max_points
]
}
}
)
The 'rmstrace-graph' is defined as such:
html.Div([
dcc.Graph(id='rmstrace-graph', figure=fig_rmstrace),
], className='six columns')
And the corresponding figure used for the dash graph is the following:
fig_rmstrace = go.Figure(data=go.Scattergl(y=[], x=[]))
How should the 'return' from the clientside callback be wrote if I like to get a second trace from the same dash graph ?
return [
{
y: [rms.rms, averaged_rms.rms],
x: [rms.t, averaged_rms.t],
}
[0, 1],
rms.max_points
]