Python plotly dash:以静默方式更新数据表的回调失败
我在屏幕上显示了一个数据表，我构建了一个litle下拉菜单，因为我想根据这个小部件上选择的值过滤该表。虽然没有输出错误，但表不会更新。它只是保持不变。我跟随这篇文章寻求帮助。我感觉自己非常接近，但无法找出问题所在 以下是我迄今为止所能做到的： html代码：Python plotly dash:以静默方式更新数据表的回调失败,python,html,plotly-dash,Python,Html,Plotly Dash,我在屏幕上显示了一个数据表，我构建了一个litle下拉菜单，因为我想根据这个小部件上选择的值过滤该表。虽然没有输出错误，但表不会更新。它只是保持不变。我跟随这篇文章寻求帮助。我感觉自己非常接近，但无法找出问题所在 以下是我迄今为止所能做到的： html代码： app.layout = html.Div(children=[ html.Br(), html.Br(), html.Br(), #,style={'bo
app.layout = html.Div(children=[
html.Br(),
html.Br(),
html.Br(),
#,style={'border':'solid 0.1em','border-color': 'transparent transparent #ff5402','font-size':'1em', 'color':'#ff5402'}),
html.Div(children=[
html.Div(
html.Div(html.H1("Demand planning"),
className="col-sm-12 inline-block")),
html.Br(),
html.Br(),
html.Div(children=[
html.Div([
dcc.Dropdown(
id='item',
options=[{'label': name, 'value': name} for name in available_items],
value='choose an item')
]),
html.Br(),
html.Div(children=[
html.Br(),
html.Div(children=[
html.Div(html.H4("Forecast"),style={'padding-left':10}),
dash_table.DataTable(
id='table',
columns=[{"name": i, "id": i} for i in forecast.columns],
style_cell={'whiteSpace': 'normal','height': 'auto',},
data=forecast.to_dict('rows'),
sort_action='native',
filter_action='none',
export_format='csv',
page_action = 'native',
page_current = 0,
page_size = 10,
style_cell_conditional = [
{'if': {'column_id': 'Id'},
'width': '30%', 'textAlign':'left'},
{'if': {'column_id': 'QuantityMin'},
'width': '30%', 'textAlign':'left'},
{'if': {'column_id': 'QuantityMax'},
'width': '30%', 'textAlign':'left'},
{'if': {'column_id': 'Probability'},
'width': '30%', 'textAlign':'left'},
],
style_data_conditional=[
{'backgroundColor': 'rgba(0, 0, 0,0)'}],
style_header={'backgroundColor': 'rgb(230, 230, 230)','font-size' : '10px'})
],
className= "mx-auto justify-content-left", style={'display': 'inline-block', "width":800,"height":475,"margin": 5}),##ca va avec le children du datatable
],className="row justify-content-center",style={'display': 'flex','align': 'center','heigh':475,'textAlign': 'center','border':'solid 0.05em','border-color': 'lightgray'}
), #celui la cest celui au dessus du Br()
],className='container', style={'padding-top':10, 'padding-bottom':50}), #ca c;est le children entre les deux br
])
])
@app.callback(
Output('table-container', 'children'),
[Input('item', 'name')],)
def update_figure(forecast):
print('name')
forecast = forecast[forecast['Id'] == 'name']
print(forecast)
return html.Div(
[
dash_table.DataTable(id='table', columns=[{'id': name, 'value': name} for name in forecast.columns.values])
]
)
forecast = forecast[forecast['Id'] == 'name']
TypeError: 'NoneType' object is not subscriptable
如果有人能帮我找出表不更新的原因，我将不胜感激。我猜您没有看到错误，因为您已将
抑制回调\u异常设置为True
回调的问题是，您的输出如下所示：
Output('table', 'figure')
表
是一个数据表
，没有属性图
您可以改为使用div将表包围起来，让我们调用这个表容器
，并将回调中的输出更改为：
Output("table-container", "children")
调整布局：
app.layout = html.Div(
children=[
html.Br(),
html.Br(),
html.Br(),
# ,style={'border':'solid 0.1em','border-color': 'transparent transparent #ff5402','font-size':'1em', 'color':'#ff5402'}),
html.Div(
children=[
html.Div(
html.Div(
html.H1("Demand planning"), className="col-sm-12 inline-block"
)
),
html.Br(),
html.Br(),
html.Div(
children=[
html.Div(
[
dcc.Dropdown(
id="item",
options=[
{"label": name, "value": name}
for name in available_items
],
value="choose an item",
)
]
),
html.Br(),
html.Div(
children=[
html.Br(),
html.Div(
children=[
html.Div(
html.H4("Forecast"),
style={"padding-left": 10},
),
html.Div(
id="table-container",
children=[
dash_table.DataTable(
id="table",
columns=[
{"name": i, "id": i}
for i in forecast.columns
],
style_cell={
"whiteSpace": "normal",
"height": "auto",
},
data=forecast.to_dict("rows"),
sort_action="native",
filter_action="none",
export_format="csv",
page_action="native",
page_current=0,
page_size=10,
style_cell_conditional=[
{
"if": {"column_id": "Id"},
"width": "30%",
"textAlign": "left",
},
{
"if": {
"column_id": "QuantityMin"
},
"width": "30%",
"textAlign": "left",
},
{
"if": {
"column_id": "QuantityMax"
},
"width": "30%",
"textAlign": "left",
},
{
"if": {
"column_id": "Probability"
},
"width": "30%",
"textAlign": "left",
},
],
style_data_conditional=[
{
"backgroundColor": "rgba(0, 0, 0,0)"
}
],
style_header={
"backgroundColor": "rgb(230, 230, 230)",
"font-size": "10px",
},
),
],
),
],
className="mx-auto justify-content-left",
style={
"display": "inline-block",
"width": 800,
"height": 475,
"margin": 5,
},
), ##ca va avec le children du datatable
],
className="row justify-content-center",
style={
"display": "flex",
"align": "center",
"heigh": 475,
"textAlign": "center",
"border": "solid 0.05em",
"border-color": "lightgray",
},
), # celui la cest celui au dessus du Br()
],
className="container",
style={"padding-top": 10, "padding-bottom": 50},
), # ca c;est le children entre les deux br
]
),
]
)
另外，“value”
不是列的有效键，我想您是在寻找“name”
有关最简单的示例，请参阅文档
基于输入值过滤DataTable
数据的回调的一般示例如下：
@app.callback(
Output("table-container", "children"),
[Input("item", "value")],
)
def update_figure(input_value):
dff = forecast[forecast["species"] == input_value]
return html.Div(
[
dash_table.DataTable(
id="table",
columns=[{"id": name, "name": name} for name in dff.columns.values],
data=dff.to_dict("records"),
)
]
)
在上面的示例中，我将forecast
设置为等于iris
数据集，并稍微更改了过滤器，因为我不知道您的数据是什么样子。谢谢您的回答，它仍然不起作用。我认为问题在于回调函数。我不知道如何从下拉列表中传递'name'变量来过滤DataFrame我更新了答案，给出了如何更新datatable中显示的数据的一般示例。还是要根据输入值更新显示的列？感谢使用，您的代码段结构使我的代码正常工作！虽然，我不明白输入值参数来自哪里。我从回调中的输入（“item”，“value”）
中学会了如何做。输入
映射到update\u图的第一个参数
。因此，调用什么参数并不重要，您可以将input\u value
更改为x
，这也会起作用。在将输入
映射到参数时，顺序很重要，但这里的顺序不相关，因为只有一个输入
。