Config of dcc.Graph cannot be updated in a callback

📊 Plotly Python
1

The config attribute of a dcc.Graph object can only be set on creation and after it is not possible to change it in a callback. This would be very helpful to e.g. change toImageButtonOptions
I stumbled across some old gitHub threads (e.g.: this) concerning this issue and wondered if there’s any community workaround for this besides creating a whole new dcc.Graph object which seems rather laborious

3

Hey @luggie,

I don’t know what to think about this, actually. Could be a bug.

I tried with a client-side callback. This only works, if you are returning the figure AND the config (what you mention).

But at least, there is no traffic between server and client if using a client-side callback.

import dash
from dash import Input, Output, State, dcc, html, clientside_callback
import plotly.express as px

app = dash.Dash()
server = app.server

app.layout = html.Div(
    [
        dcc.Graph(
            id="line-graph",
            figure=px.line(x=[1, 2, 3], y=[1, 2, 3]),
            config={"displayModeBar": True}
        ),
        dcc.RadioItems(
            options=[
                {"label": "Show modebar", "value": 1},
                {"label": "Hide modebar", "value": 0},
            ],
            id="radio",
        ),
        html.Div([html.H3("Current config"), html.P(id="cur-config")]),
    ]
)


clientside_callback(
    """
    function(value, figure) {
        fig = JSON.parse(JSON.stringify(figure))
        if (value === 0) {
            config={"displayModeBar": false}
        } else {
            config = {"displayModeBar": true}
        }
        return [fig, config]
    }
    """,
    Output("line-graph", "figure"),
    Output("line-graph", "config"),
    Input("radio", "value"),
    State("line-graph", "figure"),
    prevent_initial_call=True
)


if __name__ == "__main__":
    app.run(debug=True, port=8050)
``
4

thx! close enough :slight_smile:

And yep, I think this smells like a bug but one that is around for a while …