Duplicate a graph in another tab

tracek · May 12, 2019, 9:53pm

Hi,

I’d like to duplicate a graph from one tab to another tab. Everything that happens in graph on the first tab should be reflected in the second one. Any thoughts on how to achieve that?

If it’s of any interest, here’s the relevant piece of code:

github.com

tracek/audio-explorer/blob/c7bced1ba893184c914b1440e0d7fba42ae8491f/application.py#L515


            np.save(time_path, time)
            start = 0
            end = time[-1]


        fig = visualize.spectrogram_shaded(S=Sxx, time=time, fs=SAMPLING_RATE, start_time=start, end_time=end)
        return fig
    else:
        raise PreventUpdate




@app.callback(Output('embedding-graph-2', 'figure'),
             [Input('embedding-graph', 'figure')])
def copy_graph(fig):
    return fig


# @app.callback(Output('waveform-graph', 'figure'),
#              [Input('embedding-graph', 'selectedData'),
#               Input('filename-store', 'data'),
#               Input('waveform-graph', 'relayoutData'),
#               Input('apply-button', 'n_clicks')],
#              [State('bandpass', 'value')])

The original tab is “Explore”, while I want to replicate it, with all events, in “Profile”:
https://audioexplorer.online/

The app helps in audio exploration and annotation. If you need an audio sample, here is one.

tcbegley · May 14, 2019, 11:11am

One way to do this would be to use dcc.Store to store the figure, then populate the content of each tab from the stored figure.

Check out this example. It uses tabs from dash-bootstrap-components, but it should translate to dash-core-components pretty easily if you prefer to use that.