单击破折号中的按钮后,从数据框中填充破折号表

时间:2020-09-06 05:40:26

标签: python plotly plotly-dash

我已经开始看破折号/情节,无法弄清楚我在做什么错。我想通过回调用dash_table更新div。数据来自pandas dataframe / db查询

我试图将代码缩减到最小

import dash
import dash_table
import dash_core_components as dcc
import dash_html_components as html
import dash_bootstrap_components as dbc
from dash.dependencies import Output, Input, State

import datetime
import re
import pandas as pd

import plotly.graph_objects as go

app = dash.Dash()

app.layout = html.Div(children=[html.Div("Dashboard",
                                     style={"color": "white", "text-align": "center", "background-color": "blue", "display": "inline-block", "width": "100%", "font-size": "46px",
                                            }),
                            dcc.Tabs([
                                dcc.Tab(label='Upcoming events',
                                        children=[
                                            html.Div("Select a period: ",
                                                    style={"text-align": "center"}),
                                            html.Div(
                                                dcc.DatePickerRange(
                                                    id="calendar_period",
                                                    start_date_placeholder_text="Start Period",
                                                    end_date_placeholder_text="End Period",
                                                    start_date=datetime.datetime.today(),
                                                    end_date=datetime.datetime.today(),),
                                                style={"text-align": "center"}
                                            ),
                                            html.Div(
                                                html.Button("Retrieve calendar", id="submit_period", n_clicks=0),
                                                style={"text-align": "center"}
                                            ),
                                            html.H1(id='calendar_table'),
                                        ]),
                                dcc.Tab(label='Some other tab',)
                                ])
                            ])


@app.callback(
[Output('calendar_table', 'children')],
[Input('calendar_period', 'start_date'), Input('calendar_period', 'end_date')],
[State('submit_period', 'n_clicks')])

def retrieve_calendar(start_date, end_date, n_clicks):
    events = pd.read_sql_query(...) #<- query based on start_date and end_date both in date format
    columns = [{"name": i, "id": i, } for i in events.columns]
    df_data = events.to_dict('rows')


    return dash_table.DataTable(data=df_data, columns=columns)


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

运行文件并转到127.0.0.1:8050时,我有日期范围选择器,可以选择日期。我确实在python中检索了正确的日期。但是,当我单击按钮时,什么也没有发生。我使用各种开始/结束日期进行了几次试验,并且数据库查询在几秒钟内返回了数据帧。我也尝试过

Input('submit_period', 'n_clicks')

但是什么都不会弹出。

编辑:我收到以下错误消息:

回调..calendar_table.children ..是一个多输出。

有点困惑,因为我的回调仅定义了一个输出:

Output('calendar_table', 'children')

我还添加了:

def retrieve_earnings(start_date, end_date, n_clicks):
    events = pd...
                    
    print(events.head())
    columns = [{"name": i, "id": i, } for i in events.columns]
    print(columns)
    df_data = events.to_dict('records')
    print(df_data)

    return dash_table.DataTable(data=df_data, columns=columns)

我得到两次

Empty DataFrame

,并且在启动编程5秒钟后(减去选择日期范围的时间)后,print(events.head())在Python控制台中显示了正确的数据,但仍然存在相同的多输出错误,并且没有数据表显示在127.0.0.1

Edit2:我将状态从“状态”切换为“输入”,然后返回[dash_table.DataTable(...)],这似乎是“花招”,但在这种情况下,提交按钮没用...

1 个答案:

答案 0 :(得分:1)

您的回调将输出定义为长度为1的列表。Dash认为这是一个多输出回调。删除方括号([]),然后将其命名为Output()。那应该可以解决您的错误。