Disable interactivity for a complete graph component?

Dash Python
1

I’ve got a choropleth map in for which I would like to completely disable any interactivity (but still have it showing) after the user clicks a state. Is this possible? (I’m using Plotly Express inside a Dash app.)

Thanks.

2

Off the top of my head, there’s usually a staticPlot config key that you can be set to True or False. At least that’s the case for dcc.Graph and go. Not sure if that applies to px though.

3

Thanks @cufflink. I can’t figure out how to set that programmatically in a callback. It works great though when it’s set into the config dictionary of my dcc.Graph call in the app.layout.

What am I missing?

4

@russmcb. Here’s an example with a callback. it updates the graph every second, but uses the staticPlot config.

import dash
import dash_core_components as dcc
import dash_html_components as html
import datetime as dt
from dash.dependencies import Input, Output

external_stylesheets = ['https://codepen.io/chriddyp/pen/bWLwgP.css']

app = dash.Dash(__name__, external_stylesheets=external_stylesheets)

app.layout = html.Div([
    dcc.Graph(id='mygraph'),
    dcc.Interval(
        id='interval-1-component',
        interval=1 * 1000,  # in milliseconds
        n_intervals=0
    ),
])


@app.callback([Output('mygraph', 'figure'),
               Output('mygraph', 'config')],
              [Input('interval-1-component', 'n_intervals')])
def update_mygraph(n):
    fig = {
        'data': [
            {'x': [1, 2, 3], 'y': [4, 1, 2], 'type': 'bar', 'name': 'SF'},
            {'x': [1, 2, 3], 'y': [2, 4, 5], 'type': 'bar', 'name': u'Montréal'}
        ],
        'layout': {
            'title': f'Static Graph Demo: {dt.datetime.now()}'
        }
    }

    config = {'staticPlot': True}

    return fig, config


if __name__ == '__main__':
    app.run_server(debug=True)
5

Thanks for taking the time to write that up! That works great. I would not have thought to use an Output. I will mark the question as solved.

Alas, I still need to receive hover and click data, just not show any visual signs of interaction with the dcc.Graph. I found this: Hiding Plotly's hover text in g.hoverlayer?
but as a newbie I’m not sure how to "set each of my graph’s to hoverinfo: None. (I should probably post this in a separate question…)

6

NP, glad to help! I you still want hover and click data, you may need to explore other config options. The staticPlot seems to just disable everything, but you could remove that and then just pick what features of your graph are available to the user. Check out all of the config options available under “config ( dict ; optional)” here: https://dash.plotly.com/dash-core-components/graph

For example, you could disable scroll zoom by setting scrollZoom to False and disable the drag/zoom handles by setting showAxisDragHandles to False. Hope that helps!

7

Thanks. successfully gotten rid of the modeBarButtons I didn’t want. If I could just get rid of the hover label entirely while retaining hoverClick and hoverData info that would be perfect. I’ll make a separate post with more informative details since we’re now on a separate topic.