时间戳

首页 > 解决方案 > plotly dash 更新条形图上的数据表数据单击

plotly - plotly dash 更新条形图上的数据表数据单击

问题描述

我有一个 Plotly dash 条形图和数据表，我希望在单击其中一个条形图时更新数据表。

我目前正在读取 display_click_data() 中选定栏的点击数据，并使用该值过滤我想要更新数据表的数据框。问题是我不确定如何返回数据框并更新数据表。我是否需要一个单独的 update_table() 函数，或者我可以从 update_click_data() 函数中返回它并从中重新创建数据表？还是有更好的方法来做到这一点？

app = DjangoDash('SimpleExample')
df1 = get_spec_dataframe('security')
df_data = get_mostfrequent_data_all()
most_frequent_words = df_data[0][:30]
most_frequent_words_values = df_data[1][:30]
df = get_dataframe()

app.layout = html.Div([
    dcc.Graph(
        id='basic-interactions',
        figure={
            'data': [
                {
                    'x': most_frequent_words,
                    'y': most_frequent_words_values,
                    'name': 'Trace 1',
                    'mode': 'markers',
                    'type': 'bar'
                }  
            ],
            'layout': {
                'clickmode': 'event+select'
            }
        }
    ),

    html.Div(className='row', children=[

        html.Div([
            html.Pre(id='click-data'),
            dash_table.DataTable(id='table',columns=[{"name": i, "id": i} for i in df.columns],data=df.to_dict('records')),
            ], className='three columns'),
    ])
])

@app.callback(
    Output('click-data', 'children'),
    [Input('basic-interactions', 'clickData')])
def display_click_data(clickData):

    if clickData != None:
        label = str(clickData['points'][0]['x'])
    else:
        label = "security"
    df = get_spec_dataframe(label)
    return (df)

标签： plotlyplotly-dashplotly-python

解决方案

您可以尝试以下方法：

首先，您需要将您的定义html.Div为空，以便将孩子作为表格传递：

html.Div(id='table')

然后将您的回调配置为输出表本身：

@app.callback(Output('table', 'children'), [Input('basic-interactions', 'clickData')])
def create_table(clickData):
    if clickData != 'null':
        table = dash_table.DataTable(columns=[{"name": i, "id": i} for i in df.columns],data=df['<filter df by clickData info>'].to_dict('records'))
    else:
        table = dash_table.DataTable(columns=[{"name": i, "id": i} for i in df.columns],data=df['<don't filter df>'].to_dict('records'))

    return table

我推荐使用selectData而不是clickData，这样视觉输入（条的选择）对用户来说更直观，并且更容易“取消选择”

推荐阅读