使用 Dash 框架创建表答案

【问题标题】：Table creation with Dash Framework使用 Dash 框架创建表
【发布时间】：2022-01-04 07:52:12
【问题描述】：

我正在尝试构建一个仪表板，用户可以在其中从下拉列表中选择熊猫数据框。他们还可以搜索、排序、查看摘要和下载数据。

我设计了许多带有文件名的下拉菜单。还添加了 dash.DataTable 组件。但我无法根据从下拉列表中选择的值调用数据框。

代码：

import dash
from dash.dependencies import Input, Output
from dash import dash_table
import dash_core_components as dcc
import dash_html_components as html
import pandas as pd


#df = pd.read_csv('data/chronos.csv')

app = dash.Dash(__name__)

app.layout = html.Div([
    dcc.Dropdown(
        id='demo-dropdown',
        options=[
            {'label': 'Chronos_data', 'value': 'chronos.csv'},
            {'label': 'CN_data', 'value': 'cn.csv'},
            {'label': 'Expression_data', 'value': 'expression.csv'}
        ],
        value='dataset'
    ),
    html.Div(id='dd-output-container'),
    dash_table.DataTable(
        id='datatable-interactivity',
        columns=[
            {"name": i, "id": i, "deletable": True, "selectable": True} for i in df.columns
        ],
        data=df.to_dict('records'),
        editable=True,
        filter_action="native",
        sort_action="native",
        sort_mode="multi",
        column_selectable="single",
        row_selectable="multi",
        row_deletable=True,
        selected_columns=[],
        selected_rows=[],
        page_action="native",
        page_current= 0,
        page_size= 15,
        export_format='xlsx',
        export_headers='display',
        merge_duplicate_headers=True
    ),
    html.Div(id='datatable-interactivity-container')
])

@app.callback(
    Output('datatable-interactivity', 'data'),
    [Input('demo-dropdown', 'value')]
)
def update_output(dropdown_val):
    df_data = pd.read_csv('data/'+dropdown_val)
    return df_data

@app.callback(
    Output('datatable-interactivity', 'style_data_conditional'),
    [Input('datatable-interactivity', 'selected_columns')]
)
def update_styles(selected_columns):
    return [{
        'if': { 'column_id': i },
        'background_color': '#D2F3FF'
    } for i in selected_columns]




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

Error: line 27, in <module>
    {"name": i, "id": i, "deletable": True, "selectable": True} for i in df.columns
NameError: name 'df' is not defined

提前致谢。

【问题讨论】：

你还没有定义df。我建议您将回调中的参数 data 和 columns 直接作为字典列表传递，而不是在布局中调整它们

标签： python pandas plotly-dash dashboard

【解决方案1】：

找到答案了。

@app.callback(
    Output('datatable-interactivity', 'data'),
    Output('datatable-interactivity', 'columns'),
    [Input('demo-dropdown', 'value')]
)
def update_output(dropdown_val):
    df_data = pd.read_csv('data/'+dropdown_val)
    return df_data, 
        [{"name": i, "id": i, "deletable": True, "selectable": True} for i in df_data.columns]

【讨论】：