Learn how to use Dash Bio for next-gen sequencing & quality control. 🧬 Access the recorded webinar.

Dash Clientside Callback update figure layout showlegend

I’ve read

https://dash.plotly.com/clientside-callbacks

and implemented this example:


app.clientside_callback(
    """
    function(figure, scale) {
        if(figure === undefined) {
            return {'data': [], 'layout': {}};
        }
        const fig = Object.assign({}, figure, {
            'layout': {
                ...figure.layout,
                'yaxis': {
                    ...figure.layout.yaxis, type: scale
                }
             }
        });
        return fig;
    }
    """,
    Output('clientside-graph-px', 'figure'),
    Input('clientside-figure-store-px', 'data'),
    Input('clientside-graph-scale-px', 'value')
)

My question is how to update the figure layout showlegend value rather than the scale.

Something like this works:

//   callback_client.js    10/11/21
//   10/11/21:  Adapt from Plotly doc and Charming Data YT.
//
if(!window.dash_clientside) {window.dash_clientside = {};}
window.dash_clientside.clientside = {
    display:
        function(figure_data, input_showlegend) {

        console.log('input_showlegend: '  +  input_showlegend)

        var show_legend_ind = false

        if (input_showlegend === "Y")  {
            show_legend_ind = true
        }
    
        const fig = Object.assign({}, figure_data, {
                'layout': {
                        ...figure_data.layout,
                        'showlegend': show_legend_ind
                            }
                        });
        return fig;
    }
}


Might help someone else.