python - 回调后图形和虚线表未更新

Question

我正在使用破折号创建交互式仪表板。有一个默认数据框（比如 dashtable1），每次单击 dashtable1 的列时，我都希望更新图表，每次单击行时，我都希望更新另一个 dashtable（dashtable2）。我已经部分实现了这一点。以下是代码片段：

import pandas as pd
import plotly.express as px

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


app = dash.Dash(__name__, external_stylesheets = [dbc.themes.BOOTSTRAP], prevent_initial_callbacks=True)
app.layout = html.Div([dbc.Row(
                      [dbc.Col(html.Div(id='graph', style = {'height' : 400 , 'width' : 1750}), width = 9),dbc.Col(html.Div(id='action-df'), width = 3)]

@app.callback(
    Output(component_id='action-df', component_property='children'),
    [Input(component_id='datatable-interactivity', component_property="derived_virtual_data"),
     Input(component_id='datatable-interactivity', component_property='derived_virtual_selected_rows'),
     Input(component_id='datatable-interactivity', component_property='derived_virtual_selected_row_ids'),
     Input(component_id='datatable-interactivity', component_property='selected_rows'),
     Input(component_id='datatable-interactivity', component_property='derived_virtual_indices'),
     Input(component_id='datatable-interactivity', component_property='derived_virtual_row_ids'),
     Input(component_id='datatable-interactivity', component_property='active_cell'),
     Input(component_id='datatable-interactivity', component_property='selected_cells')])
    
def update_df(all_rows_data, slctd_row_indices, slct_rows_names, slctd_rows,
               order_of_rows_indices, order_of_rows_names, actv_cell, slctd_cell):


    dff = pd.DataFrame(all_rows_data)
    dff.dropna(inplace =True)
    action-df.iloc[slctd_row_indices[0],:]
    
    return html.Div(children = [html.Div([
                dash_table.DataTable( id = 'action-df',
                data=action_df.to_dict('records'),
                page_size=10,
                fixed_rows={'headers': True},
                
        style_cell_conditional=[    # align text columns to left. By default they are aligned to right
            {
                'if': {'column_id': c},
                'textAlign': 'left'
            } for c in action_df.columns
        ],
        style_data={                # overflow cells' content into multiple lines
            'whiteSpace': 'normal',
            'height': 'auto'
        },
        columns=[{'name': ["Changeable Parameters",i], 'id': i} for i in action_df.columns ],
        cell_selectable = True,  
        style_data_conditional=[{
            'if': {'row_index': 'odd'},
            'backgroundColor': 'rgb(88, 237, 217)'
             
        }, {'if': {'row_index': 'even'},
            'backgroundColor': 'rgb(143, 255, 240)'}],
        style_header={
        'backgroundColor': 'rgb(0, 219, 190)',
        'fontWeight': 'bold',
        'text-align': 'center'},
        fill_width = False,
        style_cell={
        'height': 'auto',
        # all three widths are needed
        'minWidth': '180px', 'width': '180px', 'maxWidth': '180px',
        'whiteSpace': 'normal',
        'font_family': "Coda Caption",
        'font_size': '18px'
    },
        style_table={
        'overflowY': 'scroll'},
        merge_duplicate_headers=True
            
         )
    ])
            
         )

@app.callback(Output(component_id = 'graph',component_property = 'children'),
             [Input(component_id = 'datatable-interactivity', component_property = 'selected_columns' )]
             )

def linechart(slctd_columns):
    if 'TIMESTAMP' not in slctd_columns:
        fig = px.line(df_merged.iloc[:30,:], x="TIMESTAMP", y= slctd_columns)
        fig.update_layout(
        title="PARAMETER VARIATION OVER THE LAST MONTH",
        xaxis_title="TIMESTAMP",
        yaxis_title= str(slctd_columns[0]),
        font=dict(
            family="Coda Caption",
            size=18,
            color="#121212"
        )
)
        return dcc.Graph(id = 'graph',
                         figure = fig)

当我第一次选择行/列时，此代码完美运行，但之后停止更新。我是 Dash 的新手，所以任何帮助将不胜感激！

标签： pythonplotly-dashdashboard