我们如何在Dash Table中使用回调函数动态创建数据列

Question

我试图创建在Web上使用输入的仪表板。然而，问题是，数据是从数据库创建的回调和先验，我不知道列的名称，除非熊猫dataframeis使用回调函数创建。我已经检查我得到正确的数据。但是不能显示它。我使用了多个输出选项（使用Dash 0.41）

我的代码看起来如下：（我没有提供函数的详细信息，它生成的熊猫数据帧在回调某些Func，因为这是不重要的这个破折号代码麻烦拍摄的目的。

 import dash_table as dt

 def someFunc(ID, pattern_desc, file_path):

       ## do something 
      return df # pandas dataframe

 external_stylesheets = ['https://codepen.io/chriddyp/pen/bWLwgP.css']

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

 server = app.server

 app = dash.Dash(__name__)

 app.config.suppress_callback_exceptions = True
 app.css.config.serve_locally = True
 app.scripts.config.serve_locally = True


 app.layout = html.Div(
      children = [
      html.Div(
      id = 'title',
      children = appTitle,
      className = 'titleDiv'  
   ),
 html.Div(
    children = [
        html.Div(
            children = "Enter ID:",
            className = 'textDiv'
        ),
        dcc.Input(
            id = 'ID',
            type = 'text',
            value = 'ABCER1',
            size = 8),

        html.Div(
            children = "Enter Test Pattern",
            className = 'textDiv'
        ),
        dcc.Input(
            id = 'pattern_desc',
            type = 'text',
            value = 'Sample',
            size = 20),

         html.Div(
            children = "Enter File OutPut Path:",
            className = 'textDiv'
        ),
        dcc.Input(
            id = 'file_path',
            type = 'text',
            value = '',
            size = 30),

        html.Button(
            id = 'submit',
            n_clicks = 0,
            children = 'Search'
        )
    ]
),

    html.Div(
        id = 'tableDiv',
        children = dash_table.DataTable(
        id = 'table',
        style_table={'overflowX': 'scroll'},
        style_as_list_view=True,
        style_header={'backgroundColor': 'white','fontWeight': 
            'bold'},
         ),
        className = 'tableDiv'
    )
  ]
)

  # callback to update the table
  @app.callback([Output('table', 'data'),Output('table', 'columns')]
          [Input('submit', 'n_clicks')],
          [State('ID', 'value'),  State('pattern_desc', 'value'), 
        State('file_path', 'value')])
   def update_table(n_clicks, ID, pattern_desc, file_path):

         df = someFunc(ID, pattern_desc, file_path)
    mycolumns = [{'name': i, 'id': i} for i in df.columns]
        return html.Div([
                dt.DataTable(
            id='table',
            columns=mycolumns,
            data=df.to_dict("rows")
         )
        ])

因此，在本例中，接受3个输入参数的函数someFunc返回一个数据帧，该数据帧可以基于输入具有不同的列。因此，应用程序布局应该根据输入动态显示回调函数输出所给出的列。我应该得到的网页填充表和列，但不是得到一个错误。当我运行这个函数时，我将通过函数生成的数据获取到文件中，但dash无法生成网页上的表。我得到以下错误：

猛冲例外情况。InvalidCallbackReturnValue:回调。。桌子数据桌子柱。。是一个多输出。输出类型应为列表或元组，但得到了Div（[DataTable（columns=[{'name'：'pattern\u desc'，'id'：'pattern\u desc'}。。。。。。

我不知道如何才能做到这一点。任何帮助都将不胜感激。

Answer 1

如果我理解正确，那么您可以简单地创建另一个回调，为列属性输出更新后的值。您还可以使用多输出回调同时更新这两个。

@app.callback(Output('table', 'columns'),
    [Input('submit', 'n_clicks')],
    [State('ID', 'value'),  State('pattern_desc', 'value'), 
     State('file_path', 'value')])
def update_table(n_clicks, ID, pattern_desc, file_path):
    mydata = someFunc(ID, pattern_desc, file_path)
    # here you would use the dataframe columns to create the new column values
    return new_column_values

Answer 2

在仪表板回调中，您应该向两个单独的输出返回两个单独的值：[输出（'table'，'data'），输出（'table'，'columns'）]

您将返回：

return html.Div([
                dt.DataTable(
            id='table',
            columns=mycolumns,
            data=df.to_dict("rows")
         )
        ])

只有1个输出。

Dash希望列表或元组中有2个返回值，如下所示：

return("output1" , outputVariable2)

或

return[ Html.Div("text") , "output Text 2"]

为了解决这个问题，要么在元组或列表中返回2个值，要么编辑输出要求，这样就只需要一个值。

从它的外观来看，你试图返回一个带有数据的Div，所以你可以做以下更改：

    html.Div(
        id = 'tableDiv',
        className = 'tableDiv'
    )

...

  @app.callback([Output('tableDiv', 'children')]
          [Input('submit', 'n_clicks')],
          [State('ID', 'value'),  State('pattern_desc', 'value'), 
        State('file_path', 'value')])
   def update_table(n_clicks, ID, pattern_desc, file_path):

         df = someFunc(ID, pattern_desc, file_path)
    mycolumns = [{'name': i, 'id': i} for i in df.columns]
        return html.Div([
                dt.DataTable(
            id='table',
            columns=mycolumns,
            data=df.to_dict("rows")
         )
        ])