plotly / plotly/dash

Config attribute of dcc.Graph does not respond to callbacks (is read-only)

Open
#2,865 2 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

bug P3
Dominant language
Python
Stars
24.4k
Forks
2.3k
Avg merge
2d 7h
Merged PRs (30d)
13

Description

When using a callback to control the modebar settings on a chart through the config property of a dcc.Graph, the graph does not update but retains the initial setting.

Note: I have not (yet) tested with other config settings.

Minimal example
import dash
import dash_core_components as dcc
import dash_html_components as html
from dash.dependencies import Input, Output, State
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]),
        ),
        dcc.RadioItems(
            options=[
                {"label": "Show modebar", "value": 1},
                {"label": "Hide modebar", "value": 0},
            ],
            value=1, # Note that if this value is set to 0 then the modebar will stay turned off rather than turned on.
            id="radio",
        ),
        html.Div([html.H3("Current config"), html.P(id="cur-config")]),
    ]
)


@app.callback(
    [Output("line-graph", "config"), Output("cur-config", "children")],
    [Input("radio", "value")],
)
def toggle_modebar(i):
    vals = [False, True]
    config = {"displayModeBar": vals[i]}
    return config, str(config)


if __name__ == "__main__":
    app.run_server(debug=True, port=8050)
Screen recording

https://user-images.githubusercontent.com/38958867/107691811-edb77d00-6c79-11eb-8488-c750b635f815.mov

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by running the minimal Python example and exercising the dcc.Graph config callback with the modebar setting. Trace how dcc.Graph receives and applies callback updates, then verify that changing the radio selection changes the graph's modebar behavior rather than only the displayed config.

Written by the indexing model from the issue text.

Assessment

Tech stack
plotly, python
Domain
data-visualization, frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.