首页 > 解决方案 > Plotly Dash App:两个相互依赖的组件

问题描述

我正在尝试创建一个应用程序,其中两个组件(在本例中为单选按钮和下拉菜单)相互依赖。这意味着当单选按钮更改时,下拉菜单需要调整,反之亦然。

单向依赖相当简单,每个回调都可以单独工作。但是,当同时包含两者时,应用程序会在浏览器中显示“加载依赖项时出错”。

import pandas
import sys
import dash
import dash_core_components as dcc
import dash_html_components as html
import pandas as pd
import plotly.graph_objs as go
import datetime
import numpy as np
import math

df = pandas.DataFrame(list(zip([1,2,3], ['a', 'b', 'c'])))

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

app.layout = html.Div(
    [
        html.P('Select:'),
        dcc.RadioItems(
            id='radio',
            options=[
                {'label': x, 'value': x} for x in df[0].unique()
            ],
            value=df[0].unique()[0],
        ),
        dcc.Dropdown(
            id='dropdown',
            options=[
                {'label': x, 'value': x} for x in df[1].unique()
            ],
            value=[df[1].unique()[0]]
        ),
    ])


@app.callback(
    dash.dependencies.Output('dropdown', 'value'),
    [dash.dependencies.Input('radio', 'value')])

def update_dropdown(radio):
    return(df[df[0]==radio][1].values[0])

@app.callback(
    dash.dependencies.Output('radio', 'value'),
    [dash.dependencies.Input('dropdown', 'value')])

def update_radio(dropdown):
    return(df[df[1]==dropdown][0].values[0])

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

标签: pythonplotlyplotly-dash

解决方案


推荐阅读