时间戳

首页 > 解决方案 > 破折号下拉菜单图

plotly-dash - 破折号下拉菜单图

问题描述

我正在尝试实现一个仅在用户从下拉菜单中选择它时才显示的实时更新图。我已经使用“间隔”和下拉菜单“氧气”的输入进行了回调。我想如果“value”是“0”那么没有选择图表，我可以返回“null”（???），如果'value'='1'，那么图表会更新。这可能吗？还是我的方法不正确？

dcc.Graph(id='live-graph2', animate=False),
        dcc.Interval(
            id='graph-update',
            interval=10000,
            n_intervals=0
        )),
        dbc.Col(html.Div([
        dcc.Dropdown(
            id='oxygen',
            options=[{'label': s, 'value': s}
                     for s in main_graph.keys()],
            value=[],
            multi=True),

@app.callback(
    dash.dependencies.Output('live-graph2', 'figure'),
    [dash.dependencies.Input('oxygen', 'value'),
     dash.dependencies.Input('graph-update', 'n_intervals')],
)
def update_graph_scatter_2(n,value):
    if value == 0:
        ....
    else:
        data = {}

标签： plotly-dash

解决方案

我会以不同的方式处理这个问题。

如果您在未选择下拉选项时根本不想显示图表，则Graph默认情况下该组件不需要在布局中。

相反，您可以创建一个容器组件，您的Graph组件根据组件的选项值动态附加到该Dropdown组件。

以下是使用示例数据的简化示例，可根据您的要求进行调整：

import dash
import dash_html_components as html
import dash_core_components as dcc
import plotly.express as px
import dash_bootstrap_components as dbc

df = px.data.iris()

app = dash.Dash(__name__)
app.layout = html.Div(
    [
        dcc.Interval(id="graph-update", interval=10000, n_intervals=0),
        html.Div(id="graph-container"),
        dbc.Col(
            html.Div(
                [
                    dcc.Dropdown(
                        id="oxygen",
                        options=[{"label": s, "value": s} for s in [1, 2, 3]],
                        value=[],
                        multi=True,
                    )
                ]
            )
        ),
    ]
)


@app.callback(
    dash.dependencies.Output("graph-container", "children"),
    [
        dash.dependencies.Input("oxygen", "value"),
        dash.dependencies.Input("graph-update", "n_intervals"),
    ],
)
def update_graph_scatter_2(value, n):
    if value:
        # Change the line below to dynamically create the figure based on value
        fig = px.scatter(df, x="sepal_width", y="sepal_length")
        return dcc.Graph(id="live-graph2", figure=fig)

    return html.Div()

推荐阅读