显示数据框 table 使用过滤器输入来过滤行

Question

我想显示一个下拉选择器，在显示为 table 的数据框下方，并在下拉选择中进行过滤。

示例代码：

import dash
import dash_table
import dash_core_components as dcc
import dash_html_components as html
import pandas as pd

# example df
df = pd.DataFrame({'numbers': [1, 2, 3], 'letters': ['A', 'B', 'C']})

# App layout
app = dash.Dash(__name__, prevent_initial_callbacks=True, suppress_callback_exceptions=True)
app.layout = html.Div([
    dcc.Dropdown(
        id='demo-dropdown',
        options=[
            {'label': 'A', 'value': 1},
            {'label': 'B', 'value': 2},
            {'label': 'C', 'value': 3}
        ],
        value=1
    ),
    html.Div(id='dd-output-container'),

    # want this df to print out underneath the filter
    dash_table.DataTable(id='df')
])

@app.callback(
    dash.dependencies.Output('dd-output-container', 'children'),
    [dash.dependencies.Input('demo-dropdown', 'value')])
def update_output(value):
    return df[df['letters']=='what do I put here to print out the filtered df?']

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

我在与我的目标相关的两个方面苦苦挣扎：

如果我想在此处显示数据框，行 dash_table.DataTable(id='df') 的要点是否正确？我尝试将其设为静态以仅显示任何内容，但失败了。
return df[df['letters']=='what do I put here to print out the filtered df?'] 行有望说明我正在尝试做什么？

使用此示例，如何显示下拉菜单和 table，其中 table 根据下拉选择进行过滤？

当我尝试上面的代码块时出现错误：

dash.exceptions.InvalidCallbackReturnValue: The callback for <Output dd-output-container.children> returned a value having type DataFrame which is not JSON serializable.

The value in question is either the only value returned, or is in the top level of the returned list,

and has string representation Empty DataFrame Columns: [numbers, letters] Index: []

In general, Dash properties can only be dash components, strings, dictionaries, numbers, None, or lists of those.

Answer 1

下拉列表的 return 值为整数，因此它将是数据框的 'number' 列。还有，Dash中的table是dict格式的，需要转换一下

import dash
import dash_table
import dash_core_components as dcc
import dash_html_components as html
import pandas as pd

# example df
df = pd.DataFrame({'numbers': [1, 2, 3], 'letters': ['A', 'B', 'C']})

# App layout
app = dash.Dash(__name__, prevent_initial_callbacks=True, suppress_callback_exceptions=True)

app.layout = html.Div(children=[
    dcc.Dropdown(
        id='demo-dropdown',
        options=[
            {'label': 'A', 'value': 1},
            {'label': 'B', 'value': 2},
            {'label': 'C', 'value': 3}
        ],
        value=1
    ),
    dash_table.DataTable(id='dd-output-container',
                         data=df.to_dict('records'),
                         columns=[{'id': c, 'name': c} for c in df.columns.values]) #  
])
@app.callback(
    dash.dependencies.Output('dd-output-container', 'data'),
    [dash.dependencies.Input('demo-dropdown', 'value')])
def update_output(value):
    dfs = df.loc[df['numbers'] == value]
    return dfs.to_dict('records') 

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

显示数据框 table 使用过滤器输入来过滤行

Display a data frame table using a filter input to filter rows

python

pandas

plotly

plotly-dash