显示下拉条值的控制逻辑 -plotly dash

Question

有没有一种方法可以根据单独的控制逻辑来过滤或屏蔽破折号下拉栏中的值。例如，在下面使用时，我只想显示

A

的值（如果它被选中）。我可以在图表中控制它，强制

A

成为唯一显示的值。

但是，下拉栏并不反映图表内的值。

1. 如果首先选择

   A

   ，下拉列表中的剩余值应被锁定或删除，直到

   A

   被清除。

2. 如果在

   单独的值之后选择

   A，则A

   应该是下拉栏中的唯一项目，然后应锁定或删除这些值，直到清除

   A

   。

这可以用plotly dash来实现吗？

import dash
from dash import dcc
from dash import html
from dash.dependencies import Input, Output
import dash_bootstrap_components as dbc
import plotly.express as px
import pandas as pd

df = pd.DataFrame({
       'Type': ['A','B','C','D','E','F'],
       })

N = 300
df = pd.concat([df] * N, ignore_index=True)

df['TIMESTAMP'] = pd.date_range(start='2024/01/01 07:36', end='2024/01/30 08:38', periods=len(df))

df['DATE'], df['TIME'] = zip(*[(d.date(), d.time()) for d in df['TIMESTAMP']])
df['DATE'] = pd.to_datetime(df['DATE'], format='%Y-%m-%d')


external_stylesheets = [dbc.themes.SPACELAB, dbc.icons.BOOTSTRAP]

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


filter_box = html.Div(children=[
        html.Div(children=[
            dcc.Dropdown(
                id = 'Type',
                options = [
                    {'label': x, 'value': x} for x in df['Type'].unique()
                ],
                value = ['A'],
                multi = True,
                clearable = True,
                style = {'display': 'inline-block','margin':'0.1rem'}
            ),       
        ], className = "vstack gap-1 h-100",            
        )
    ])

app.layout = dbc.Container([
        dbc.Row([
            dbc.Col([
                dbc.Row([
                    dbc.Col(html.Div(filter_box), 
                            ),
                ]),
            ]),
            dbc.Col([
                dbc.Row([
                    dcc.Graph(id = 'date-bar-chart'),
                ]),
            ])
        ])
    ], fluid = True)

@app.callback(
        Output('date-bar-chart', 'figure'),
        [Input('Type','value'), 
        ])     

def chart(value_type):
    
        #force A to be the sole value if selected
        if 'A' in value_type:
             value_type = ['A']
        else:
             value_type = value_type


        dff = df[df['Type'].isin(value_type)]

        df_count = dff.groupby(['DATE','Type'])['DATE'].count().reset_index(name = 'counts')

        type_fig = px.bar(x = df_count['DATE'], 
                          y = df_count['counts'],
                          color = df_count['Type']
                          )
        return type_fig

if __name__ == '__main__':
        app.run_server(debug = True, port = 8052)

Answer 1

是的，有。这是您的代码的修改建议，其中我添加了一个函数

update_dropdown_options

：

import dash
from dash import dcc, html, Input, Output
import dash_bootstrap_components as dbc
import plotly.express as px
import pandas as pd

df = pd.DataFrame({
    'Type': ['A', 'B', 'C', 'D', 'E', 'F'],
})

N = 300
df = pd.concat([df] * N, ignore_index=True)

df['TIMESTAMP'] = pd.date_range(start='2024/01/01 07:36', end='2024/01/30 08:38', periods=len(df))
df['DATE'] = pd.to_datetime(df['TIMESTAMP'].dt.date)

external_stylesheets = [dbc.themes.SPACELAB, dbc.icons.BOOTSTRAP]

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

filter_box = html.Div([
    dcc.Dropdown(
        id='Type',
        options=[{'label': x, 'value': x} for x in df['Type'].unique()],
        value=['A'],
        multi=True,
        clearable=True,
        style={'display': 'inline-block', 'margin': '0.1rem'}
    )
])

app.layout = dbc.Container([
    dbc.Row([
        dbc.Col([
            dbc.Row([
                dbc.Col(html.Div(filter_box)),
            ]),
        ]),
        dbc.Col([
            dbc.Row([
                dcc.Graph(id='date-bar-chart'),
            ]),
        ])
    ])
], fluid=True)


@app.callback(
    Output('Type', 'options'),
    [Input('Type', 'value')]
)
def update_dropdown_options(selected_values):
    if 'A' in selected_values:
        options = [{'label': 'A', 'value': 'A'}]
    else:
        options = [{'label': x, 'value': x} for x in df['Type'].unique()]
    return options


@app.callback(
    Output('date-bar-chart', 'figure'),
    [Input('Type', 'value')]
)
def chart(value_type):
    if 'A' in value_type:
        value_type = ['A']
    else:
        value_type = value_type

    dff = df[df['Type'].isin(value_type)]

    df_count = dff.groupby(['DATE', 'Type'])['DATE'].count().reset_index(name='counts')

    type_fig = px.bar(x=df_count['DATE'],
                      y=df_count['counts'],
                      color=df_count['Type']
                      )
    return type_fig


if __name__ == '__main__':
    app.run_server(debug=True, port=8052)

这给出了