web-dev-qa-db-fra.com

Python Dash Plotly: affiche les données par défaut les plus proches au survol ou compare les données au survol dans le graphique

Je crée une application simple en utilisant Dash Plotly.
Le paramètre par défaut est que le graphique "Compare les données en survol".
enter image description here

Je souhaite modifier le paramètre par défaut en 'Afficher les données les plus proches au survol': enter image description here

Comment cela peut-il être fait dans le code ci-dessous?

import dash
import dash_core_components as dcc
import dash_html_components as html

app = dash.Dash(__name__)

app.layout = html.Div(children=[
    html.H1(children='Hello New Other Change', ),

    html.Div(children='''
        Dash: A web application framework for Python.
    '''),

    dcc.Graph(
        id='example-graph',
        figure={
            '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': 'Dash Data Visualization',
            }
        }
    )
])

if __name__ == '__main__':
    app.run_server(debug=True)
pythonplotlyplotly-dash
9
Sander van den Oord

La définition de la valeur par défaut de votre graphique sur affichant les données les plus proches dans un tiret graphique peut être effectuée en ajoutant un mode hovermode à la figure, comme suit:

figure={
    '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': {
        'hovermode': 'closest',
    }
}

Définir votre graphique par défaut sur comparer les données se fait par:

'layout': {
    'hovermode': 'compare',
}
7
Sander van den Oord

Mettre à jour la réponse ci-dessus, au moins à partir du tiret 1.0.2:

layout.hovermode = 'closest' # for "Show closest data on hover"
layout.hovermode = 'x' # for "Compare data on hover"

Les autres options incluent:

layout.hovermode = 'y' # similar to x but switches tags accordingly
layout.hovermode = False # nothing shown on hover
3
dmbhatti