从破折号下拉列表中的行过滤后显示数据表 [英] display datatable after filtering rows from dropdown list in dash

问题描述

我是Dash的新手.我想制作一个应用程序，在这里我可以从下拉过滤器中选择值，过滤数据集并显示数据表.我正在使用dash_table.

I'm new to Dash. I would like to make a app, where I can select values from dropdown filter, filter dataset and display the data table. I'm using dash_table.

下面是我的示例应用代码.没有显示数据表.有人知道我做错了吗?如何在仪表板应用程序中渲染仪表板表?

My example app code is below. No datatable is shown. Does anyone know what I did wrong? How can I render dash table in dash app?

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

df = pd.read_csv('https://raw.githubusercontent.com/plotly/datasets/master/solar.csv')

app = dash.Dash(__name__)



states = df.State.unique().tolist()

app.layout = html.Div(
    children=[
    dcc.Dropdown(
            id='filter_dropdown',
            options=[{'label':st, 'value':st} for st in states],
            value = states[0]
            ),
    dt.DataTable(id='table-container') ]
)

@app.callback(
    Output('table-container', 'data'),
    [Input('filter_dropdown', 'value') ] )
def display_table(state):
    dff = df[df.State==state]
    return dff

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

顺便说一句，有谁知道我在哪里可以找到带有代码的破折号应用程序库的集合?

BTW, do anyone know where I can find collections of dash app gallery with code?

推荐答案

您必须设置数据表的列，并以特殊形式将数据帧作为dict返回.因此，请在您的代码中更改这两行以使其正常工作.

You have to set the columns of your data table and return your dataframe as a dict in a special form. So change these two lines in your code to make it work.

dt.DataTable(id='table-container', columns=[{'id': c, 'name': c} for c in df.columns.values])

return dff.to_dict('records')

顺便说一句，有人知道我在哪里可以找到带有代码的Dash应用程序库的集合吗?

BTW, do anyone know where I can find collections of dash app gallery with code?

带有大量示例代码的最佳场所是 Dash用户指南.例如，您可以找到数据表有.

Best place with lots of examples with code is the Dash User Guide. You can for instance find the data table there.

这篇关于从破折号下拉列表中的行过滤后显示数据表的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！